在写代码的过程中,我发现有些小伙伴不懂运算符的优先顺序,造成了很简单的bug,并且一直不知道原因。比如下面代码
<el-button v-if="a || b && c">按钮</el-button>
// 他想要实现的逻辑是c正确并且a或者b中间的一个正确才能显示按钮,可是实际上,只有a正确就会显示。
// 他修改之后
<el-button v-if="c && a || b">按钮</el-button>
// 依然不对,现在b正确就会显示了。
// 正确写法
<el-button v-if="(a || b) && c">按钮</el-button>
所以,我不得不让他查资料复习一下运算符的优先级。在此我也重新发一下给小伙伴们复习
1. 最高优先级
(表达式( ... )[数组索引[ ... ]{对象字面量{ ... }.成员访问[]成员访问new构造函数调用!逻辑非~按位非+正号-负号typeof类型查询void返回undefineddelete删除属性或变量
2. 次高优先级
**幂运算
3. 乘除运算
*乘法/除法%取模
4. 加减运算
+加法-减法+=加法赋值-=减法赋值*=乘法赋值/=除法赋值%=取模赋值
5. 位移运算
<<左移>>右移>>>无符号右移
6. 比较运算
<小于<=小于等于>大于>=大于等于in存在性检查instanceof类型检查
7. 相等运算
==相等(类型转换)!=不相等(类型转换)===严格相等!==严格不相等
8. 位与运算
&按位与
9. 位异或运算
^按位异或
10. 位或运算
|按位或
11. 逻辑与运算
&&逻辑与
12. 逻辑或运算
||逻辑或
13. 条件运算
? :条件运算符
14. 赋值运算
=赋值+=加法赋值-=减法赋值*=乘法赋值/=除法赋值%=取模赋值&=按位与赋值^=按位异或赋值|=按位或赋值<<=左移赋值>>=右移赋值>>>=无符号右移赋值
15. 逗号运算
,逗号运算符 显然,在运算符优先级上,&&运算符要大于||运算符。