今天我玩了一点速记语法……发现了两种很酷的新方法来编写冗长无聊的if
语法,还学到了关于闭包的新东西……
这就是我想出的。
这是带有一个事件处理程序的手风琴菜单的切换功能。
function h(e){
var p='parentNode',a=e.target,b=a[p],f=48,u='px',y=b[p];
!y.c||(y.c==b||(y.c.style.height=f+u,y.c.x=f)),
y.c=y.c==b?null:b,
a!=b.firstChild||(b.x=b.x>f?f:
(f+b.childNodes[1].offsetHeight),b.style.height=b.x+u)
}
这是一个例子。
http://jsfiddle.net/YjCbM/(用 Chrome 29 测试)
有一个错误..这是工作http://jsfiddle.net/YjCbM/1/
在这个例子中,我使用了 e.target、webkit css3 和其他各种 ie 和其他浏览器不支持的东西,但除此之外......这种速记语法是否适用于旧/其他浏览器?
ps.:不要整理 jsfiddle 中的代码,否则没有任何效果
在我得到一些答案后编辑..
一些有用的速记
var W=window,D=W.document,G='getElementById',
E=W.addEventListener?'addEventListener':'attachEvent',
// this awesome as i don't use jQuery.
// this way i have a short getElementbyId() like jQuery's $()
// and also a ie compatible addEventListener.
a=D[G](x);
//document.getElementById(x)
a[E]('click',handler);
//a.addEventListener() or a.attachEvent()
a=x?y:x
//if x is defined, true, or not 0 it will take the y value
if ( x == true ) {
a = y;
}else{
a = x;
}
a=x||y;
//if x is not defined it will take y
if ( x == true ) {
a = x
}else{
a = y
}
x||(x=y,alert(x)) // <- this is fabulous
// if x is not defined, not true, or 0 it will set the x with the y value
// and alert x
if ( x == 'undefined' ) {
x = y;
alert ( x );
}
// how manytimes did it happen that you wanted to do just a short check but you hat to
//set 2-3 variables and could not use a simple a=x||y
// whith this shorthand you can.
var a = 1;
var b;
var c = a;
// is the same as
var a=1,b,c=a;
编辑2
- 我真的不知道这种类型的闭包和速记
- 关键不是一直以这种方式编写javascript,而是保持一个好的代码,然后以这种方式手动重写它以获得更快和更短的代码
- 正如您在评论中看到的那样“嘿,看看我能做什么!” ...再次...在发布此功能之前我不知道这一点,当时我仅在 chrome 中进行了测试。是的,多年来我一直在编写 javascript ...但不是使用这种速记和位运算符。这是对我来说有些新东西。
- 在测试了一些压缩实用程序 yuy 混淆器和更多之后,我发现它们无法像这种方式压缩你的代码,所以无论如何你必须编写一个好的代码,并且不希望各种压缩器为你做到这一点,所以你想手动缩小你的代码?...是的,这就是我想要做的。
我对所有这些反对票都禁止提问。但我真的不明白为什么我得到这么多反对票......请解释你的反对票。