美文网首页
JS中妙用&&、||精简代码

JS中妙用&&、||精简代码

作者: JuanitaLee | 来源:发表于2018-10-23 11:12 被阅读82次

在js逻辑运算中,0、""、null、false、undefined、NaN都会判为false,其他都为true

几乎所有语言中||和&&都遵循“短路”原理,如&&中第一个表达式为假就不会去处理第二个表达式,而||正好相反。

例1:用于赋值

var attr = attr || “”;这个运算经常用来判断一个变量是否已定义,如果没有定义就给他一个初始值,这在给函数的参数定义一个默认值的时候比较有用。

&&:从左往右依次判断,当当前值为true则继续,为false则返回此值(是返回未转换为布尔值时的原值)
|| : 从左往右依次判断,当当前值为false则继续,为true则返回此值(是返回未转换为布尔值时的原值)

// => aaa
var attr = true && 4 && "aaa";

// => 0
var attr = true && 0 && "aaa";

// => 100
var attr = 100 || 12;

// => e
var attr = "e" || "hahaha"

// => hahaha
var attr = "" || "hahaha"

例2:多次判断赋值

出个题:
x为>12,y=4;
x为>10,y=3;
x为>5,y=2;
x为>0,y=1;
x为<=0,y=0;

如何实现? 笨的方法就是ifelse嵌套,或者switch语句,但是写起来都很麻烦。有没有简单的方法呢?

我们来看看js的强大之处

var y= (x>12 && 4) || (x>10 && 3) || (x>5 && 2) || (x>0 && 1) || 0; 

例3:

x=12,y=4;
x=10,y=3;
x=5,y=2;
x=0,y=1;
x=0,y=0;

这个题由上一个例子可以简写成如下代码:

var y= (x==12 && 4) || (x==10 && 3) || (x==5 && 2) || (x==0 && 1) || 0; 

但是,还有更优的(但是这种写法,没查到是什么原理,懂的大佬可以帮解答下,感谢!)

var y={'5':1,'10':2,'12':3,'15':4}[x] || 0; 

相关文章

网友评论

      本文标题:JS中妙用&&、||精简代码

      本文链接:https://www.haomeiwen.com/subject/lbuozftx.html