JavaScript运算符按照功能可以分为以下几类。
| 类别 | 运算符 | 东巴文说明 |
|---|---|---|
| 算术运算符 | +, -, *, /, %, **, ++, -- | 数学计算 |
| 比较运算符 | ==, ===, !=, !==, >, <, >=, <= | 值的比较 |
| 逻辑运算符 | &&, ||, ! | 布尔运算 |
| 赋值运算符 | =, +=, -=, *=, /=, %=, **= | 变量赋值 |
| 条件运算符 | ?: | 三元运算 |
| 位运算符 | &, |, ^, ~, <<, >>, >>> | 二进制操作 |
| 字符串运算符 | +, += | 字符串拼接 |
| 其他运算符 | , delete, in, instanceof, new, typeof, void | 特殊用途 |
// 一元运算符 - 一个操作数
let x = -5; // 负号
let y = !true; // 逻辑非
let z = ++x; // 自增
// 二元运算符 - 两个操作数
let sum = 1 + 2; // 加法
let isEqual = a === b; // 比较
// 三元运算符 - 三个操作数
let result = a > b ? "大" : "小";
// 高优先级先执行
let result = 2 + 3 * 4; // 14,不是20
// 等价于
let result = 2 + (3 * 4); // 14
// 使用括号改变优先级
let result2 = (2 + 3) * 4; // 20
优先级决定了运算的执行顺序,优先级高的先执行。
| 优先级 | 运算符 | 描述 | 东巴文记忆 |
|---|---|---|---|
| 1 | () | 分组 | 括号最高 |
| 2 | . [] () | 成员访问、函数调用 | 访问优先 |
| 3 | new | 创建实例 | - |
| 4 | ++ -- | 后置递增/递减 | 后置较高 |
| 5 | ! ~ + - ++ -- typeof void delete | 一元运算符 | 一元次之 |
| 6 | ** | 幂运算 | 幂运算 |
| 7 | * / % | 乘、除、取余 | 乘除优先 |
| 8 | + - | 加、减 | 加减在后 |
| 9 | << >> >>> | 位移动 | 位运算 |
| 10 | < <= > >= in instanceof | 比较 | 比较运算 |
| 11 | == != === !== | 相等 | 相等比较 |
| 12 | & | 按位与 | - |
| 13 | ^ | 按位异或 | - |
| 14 | | | 按位或 | - |
| 15 | && | 逻辑与 | - |
| 16 | || | 逻辑或 | - |
| 17 | ?: | 条件运算符 | - |
| 18 | = += -= ... | 赋值 | 赋值较低 |
| 19 | , | 逗号 | 逗号最低 |
// 示例1:算术运算
console.log(2 + 3 * 4); // 14
console.log((2 + 3) * 4); // 20
// 示例2:比较和逻辑
console.log(true || false && false); // true
// 等价于 true || (false && false)
console.log((true || false) && false); // false
// 示例3:条件和赋值
let a = 1, b = 2;
let max = a > b ? a : b; // 2
console.log(max);
// 示例4:混合运算
let x = 2;
let y = x++ + x * 2; // 2 + 3 * 2 = 8
console.log(y); // 8
东巴文口诀:
括号成员最高级,
一元运算紧跟随,
幂运算在乘除前,
加减之后是比较,
逻辑与比逻辑或,
条件赋值逗号低。
结合性决定了相同优先级的运算符的执行顺序。
// 大多数运算符是左结合
let a = 10 - 5 - 2; // 等价于 (10 - 5) - 2 = 3
console.log(a); // 3
let b = 100 / 10 / 2; // 等价于 (100 / 10) / 2 = 5
console.log(b); // 5
let c = 1 < 2 < 3; // 等价于 (1 < 2) < 3 → true < 3 → 1 < 3 → true
console.log(c); // true
// 赋值运算符是右结合
let a, b, c;
a = b = c = 5; // 等价于 a = (b = (c = 5))
console.log(a, b, c); // 5 5 5
// 幂运算符是右结合
let d = 2 ** 3 ** 2; // 等价于 2 ** (3 ** 2) = 2 ** 9 = 512
console.log(d); // 512
// 条件运算符是右结合
let e = true ? 1 : false ? 2 : 3;
// 等价于 true ? 1 : (false ? 2 : 3)
console.log(e); // 1
// 一元运算符是右结合
let f = !!true; // 等价于 !(!true)
console.log(f); // true
| 结合性 | 运算符 | 东巴文说明 |
|---|---|---|
| 左结合 | +, -, *, /, %, &&, ||, <, >, == 等 | 从左到右计算 |
| 右结合 | =, +=, -=, **, ?:, !, ~, new 等 | 从右到左计算 |
// 示例:分析复杂表达式
let result = 2 + 3 * 4 > 10 && true || false;
// 解析步骤:
// 1. 3 * 4 = 12(乘法优先级最高)
// 2. 2 + 12 = 14(加法次之)
// 3. 14 > 10 = true(比较运算)
// 4. true && true = true(逻辑与)
// 5. true || false = true(逻辑或)
console.log(result); // true
// 使用括号使意图更清晰
let result2 = ((2 + (3 * 4)) > 10) && true || false;
console.log(result2); // true
东巴文建议:当表达式复杂时,使用括号明确运算顺序,提高代码可读性。
// 陷阱1:比较运算符优先级高于赋值
let a, b;
a = b = 5 > 3; // 等价于 a = (b = (5 > 3))
console.log(a, b); // true true
// 陷阱2:逻辑与优先级高于逻辑或
let result = true || false && false;
console.log(result); // true(不是false)
// 陷阱3:typeof优先级很高
console.log(typeof 1 + 2); // "number2"
console.log(typeof (1 + 2)); // "number"
// 陷阱1:幂运算右结合
console.log(2 ** 3 ** 2); // 512,不是64
// 陷阱2:连续比较
console.log(1 < 2 < 3); // true
console.log(3 > 2 > 1); // false!(3 > 2 = true, true > 1 = false)
// 正确写法
console.log(1 < 2 && 2 < 3); // true
console.log(3 > 2 && 2 > 1); // true
// 1. 使用括号明确意图
let result = (a + b) * c; // 清晰
let result2 = a + b * c; // 需要记住优先级
// 2. 拆分复杂表达式
let isValid = age >= 18 && age <= 65;
let hasPermission = role === "admin" || role === "editor";
let canAccess = isValid && hasPermission;
// 3. 避免连续比较
// 错误
if (min <= value <= max) {}
// 正确
if (value >= min && value <= max) {}
// 4. 使用有意义的变量名
let isAdult = age >= 18;
let canVote = isAdult && hasID;
了解了运算符概述后,让我们深入学习各类运算符:
东巴文(db-w.cn) - 让编程学习更简单
⚡ 东巴文寄语:理解运算符的优先级和结合性,是写出正确表达式的基础。记住:有疑问就用括号,让代码意图更清晰。在 db-w.cn,我们帮你掌握每一个细节!