浅谈JS运算符&&和|| 及其优先级

时间:2021-05-18

今天看了一段YUI compressor压缩的js代码:

userNum && (ind += index,ind >= userNum && (ind -= userNum),ind < 0 && (ind === -2 && (ind = -1),ind += userNum),selLi.removeClass("on"),$(selLi[ind]).addClass("on"));

直接疯掉了,估计一下子没几个人能看懂。那么就把他“翻译”一下。

&& (逻辑与)

这里主要是一个“&&”运算,首先要搞懂这个,看一个简单的例子:

1 var a = 1 && 2 && 3;//3

2 var b = 0 && 1 && 2;//0

3 var c = 1 && 0 && 2;//0

4 alert(a),alert(b),alert(c);

嘿嘿,写法很奇怪,运行的结果是3,0,0。一般我们在if语句中经常用到。“&&” (逻辑与) 运算和“||”运算真好相反,“&&” 运算遇到false就返回。

例如: a && b ,如果 a 为true,直接返回b,而不管b为true或者false 。如果 a 为false 那么直接返回a,上面例子中第一个var a = 1 && 2 && 3;因为1 && 2,1为真,返回2;2&&3, 2为真,返回3 。

搞懂了“&&” 运算,再来看最上的面的YUI compressor压缩的js代码,翻译一下:

if(userNum){ ind+=index; if(ind>=userNum){ ind-=userNum; } if(ind < 0){ if(ind === -2){ ind = -1; } ind += userNum; } selLi.removeClass("on"); $(selLi[ind]).addClass("on"); }

说来惭愧,年纪大了,足足“翻译”了半个小时,还是在同事的帮助下才“翻译”正确。

||(逻辑或)

再来看看“||”(逻辑或)运算,看例子:

1 var a = 0 || 1 || 2;//1

2 var b = 1 || 0 || 3;//1

3 alert(a),alert(b);

“||”运算遇到true就返回。例如:a || b ,如果 a 为false,直接返回b,而不管b为true或者false 。如果 a 为true,直接返回a,而不会继续往下执行。

&& (逻辑与) 和||(逻辑或)混合使用的时候要注意他们的优先级:

&& (逻辑与) 优先级高于||(逻辑或)

return a && b || c ,

根据a来判断返回值,a 是 false 则肯定返回 c;如果 b , c 都是 true ,那么我们就可以根据 a 来决定b 还是 c ,如果 a 是 false 则返回 c,如果a是true 则返回 b。

return a || b && c

根据优先级相当于先算 b && c ,然后和a 相 或;如果a是true,则返回a,不论是b或c,如果a是false,则如果b是false,返回b,如果b是true,返回c;

1 var a = 3 && 0 || 2; //2

3 var b = 3 || 0 && 2; // 3

5 var c= 0 || 2 && 3; // 3

6 alert(a),alert(b),alert(c);

另附:JS运算符优先级(从高到低列出)

运算符 描述 . [] () 字段访问、数组下标、函数调用以及表达式分组 ++ -- - ~ ! delete new typeof void 一元运算符、返回数据类型、对象创建、未定义值 * / % 乘法、除法、取模 + - + 加法、减法、字符串连接 << >> >>> 移位 < <= > >= instanceof 小于、小于等于、大于、大于等于、instanceof == != === !== 等于、不等于、严格相等、非严格相等 & 按位与 ^ 按位异或 | 按位或 && 逻辑与 || 逻辑或 ?: 条件 = oP= 赋值、运算赋值 , 多重求值

以上这篇浅谈JS运算符&&和|| 及其优先级就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章