&&|| vs ?:

前些天,群里小鱼问
<input name="checkbox" type="checkbox" onclick="$(this).is(‘:checked’) &&$(‘#checked’).slideDown(‘slow’) || $(‘#checked’).slideUp(‘slow’);" />

<p id="checked" style="display: none; " >content </p>;
为什么可以这样写

这个是因为JS等语言的对于&&||之类的运算符截断的作用
即如果&&前第一项为假,后边不用计算就知道整个表达式是假,所以就截断,不进行后面的第二项,再跟||后第三项进行或运算,这样就收起来了
如果第一项为真,那么就执行第二步,第二项返回是JQ对象,也是真,那么又截断,因为对于||或来说,只要有一个真,那整个表达式就肯定是真了。

刚看到的时候觉得好,原来还能这样做啊。但实际上分析下来,也没觉得有多好其实这种运算等同于?:运算,那何必再用这种看似很玄乎的方式呢?

进一步用代码测试
var b;
var a=new Date();
for (var i=0; i<1000000; i++) {
1&&(b=1)||(b=2);
}
alert(new Date().getTime()-a.getTime());

==============================
var b;
var a=new Date();
a=new Date();
for (var i=0; i<1000000; i++) {
1?(b=1):(b=2);
}
alert(new Date().getTime()-a.getTime());

我在IE6下,平均时间的话,用&&||花事件一般在1150毫秒左右,而用?:花1050左右
可见性能上更优,语义上更能理解的用法摆在面前,不用而故弄玄虚,何苦呢~
此文献给“叫我小鱼/;f”~

发表评论