javascript复合赋值运算符(如+=、-=等)是“运算+赋值”的语法糖,等价于先计算再赋值;支持数值、字符串拼接,但数组需避免+=以防类型转换;还支持位运算如|=、&=等。

JavaScript 中的复合赋值运算符(如 +=、-=、*= 等)能直接在变量原有值基础上执行运算并重新赋值,避免重复书写变量名,让代码更简洁、可读性更强。
常见复合赋值运算符及对应展开形式
它们本质上是“运算 + 赋值”的语法糖,等价于先计算再赋值。例如:
-
a += b等价于a = a + b -
a -= 5等价于a = a - 5 -
a *= 2等价于a = a * 2 -
a /= 10等价于a = a / 10 -
a %= 3等价于a = a % 3 -
a **= 2等价于a = a ** 2(ES2016 新增,幂运算)
字符串和数组场景下的实用简化
复合赋值对字符串拼接和数组操作同样有效,尤其适合循环中累积内容:
- 拼接字符串:
msg += "加载中...";比msg = msg + "加载中...";更紧凑 - 构建 HTML 片段:
html += `<li>${item}</li>`;在遍历时清晰自然 - 注意:对数组不能用
arr += item(这会触发隐式类型转换成字符串),应使用push()或展开运算符
结合自增/自减与位运算的进阶用法
虽然 ++ 和 -- 是独立的增量运算符,但复合赋值支持位运算,适合底层逻辑或性能敏感场景:
-
flags |= 0b0001;—— 设置某一位(按位或赋值) -
value &= ~0b1000;—— 清除某一位 index —— 左移一位,等价于乘以 2- 这些写法语义明确,且比
flags = flags | 0b0001更简练
注意事项与易错点
用得顺手时也容易踩坑,需留意:
- 运算优先级不变:
a += b * c等价于a = a + (b * c),不是(a + b) * c - 类型隐式转换依然存在:
let x = "5"; x += 3;结果是字符串"53",不是数字8 - 对象或数组引用不会被“复合”改变:
obj.val += 1没问题,但arr += item不是追加元素,而是转成字符串拼接
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











