(1) ||
短路原理: 知道了前面第一个的结果就知道后的输出。
如果第一个为:true,则取第一个的值;
如果第一个为:false,则取第二个的值。
(2) &&
同样是短路原理
1、只要“&&”前面是false,无论“&&”后面是true还是false,结果都将返“&&”前面的值;
2、只要“&&”前面是true,无论“&&”后面是true还是false,结果都将返“&&”后面的值;
记住:在js逻辑运算中,0、""、''、null、false、undefined、NaN 都会判为false,其他都为true。
开发中的应用:
1、看到很多代码if(!!attr),为什么不直接写if(attr)?
其实这是一种更严谨的写法:
请测试 typeof 5和typeof !!5的区别。!!的作用是把一个其他类型的变量转成的bool类型。
2、像var Yahoo = Yahoo || {};这种是非常广泛应用的。 获得初值的方式是不是很优雅?比if。。。。else…好很多,比?:也好不少。
3、 callback&&callback()
在回调中,经常这么写,更严谨,先判断 callback 是不是存在,如果存在就执行,这样写的目的是为了防止报错
4、综合实例
需求:
假设对成长速度显示规定如下:
成长速度为5显示1个箭头;
成长速度为10显示2个箭头;
成长速度为12显示3个箭头;
成长速度为15显示4个箭头;
其他都显示都显示0各箭头。
用代码怎么实现?
如果需求改成:
成长速度为>12显示4个箭头;
成长速度为>10显示3个箭头;
成长速度为>5显示2个箭头;
成长速度为>0显示1个箭头;
成长速度为<=0显示0个箭头。
那么你有没有想过用一行就代码实现呢?
ok,让我们来看看js强大的表现力吧:
var add_level = (add_speed == 5 && 1) || (add_speed == 10 && 2) || (add_speed == 12 && 3) || (add_speed == 15 && 4) ||0;
更强大的,也更优的:
var add_level = {‘5’:1, ’10’:2, ’12’:3, ’15’:4}[add_speed] || 0;
第二个需求:
var add_level = (add_speed > 12 && 4) || (add_speed > 10 && 3) || (add_speed > 5 && 2) || (add_speed > 0 && 1) || 0;