JavaScript逻辑赋值运算符(&&=、||=、??=)用于简化“仅满足特定条件时才赋值”的高频场景,提升简洁性、安全性与可读性,避免重复取值和误覆盖有效值。

JavaScript 引入逻辑赋值运算符(&&=、||=、??=)不是为了炫技,而是为了解决一个高频又容易写冗余的模式:**“仅在满足特定逻辑条件时才赋值”**。它们把原本需要 if 判断或三元表达式的操作,压缩成一行简洁、可读且安全的语句。
避免重复计算和冗余判断
传统写法常需先检查左侧值,再决定是否赋值,容易重复取值或调用函数:
- ❌ 冗余写法:
if (user.name === null || user.name === undefined) { user.name = 'anonymous'; } - ✅ 简洁等价:
user.name ??= 'anonymous';
??= 只在左侧为 null 或 undefined 时才赋值,且 user.name 只被读取一次——既避免多次属性访问开销,也防止 getter 重复执行或副作用。
精准匹配不同“假值”语义
三种运算符对应三种常见意图,不再被迫用模糊的 || 替代所有场景:
立即学习“Java免费学习笔记(深入)”;
-
a ||= b:当a是 falsy(false、0、''、null、undefined、NaN)时才赋值 → 适合“有值就用,没值才兜底” -
a &&= b:当a是 truthy 时才把b赋给a→ 适合“仅当前值有效时才更新”(如链式配置) -
a ??= b:仅当a是 null 或 undefined 时才赋值 → 真正的“空值合并”,保留0、false、''等有效值
例如:config.timeout ??= 5000 不会误把显式设为 0 的超时覆盖掉,而 config.timeout ||= 5000 就会。
提升可读性与减少出错
逻辑赋值是原子操作,语义明确,比手写条件逻辑更不易出错:
- ❌ 易错写法:
if (obj.data) obj.data = transform(obj.data);—— 若obj.data是0或false,会被跳过,但可能本意是“只要存在就转换” - ✅ 清晰表达:
obj.data &&= transform(obj.data);—— 明确表示“仅当原值为真时才更新”
没有括号歧义,没有忘记大括号的风险,也没有因缩进或分号缺失导致的隐蔽 bug。
兼容性好,现代开发可放心使用
所有主流浏览器(Chrome 85+、Firefox 79+、Safari 14+)及 Node.js 15+ 均已支持。配合 TypeScript 4.0+,还能获得准确的类型推导(如 ??= 后自动缩小联合类型)。构建工具(如 Babel)也支持按需降级,不影响旧环境兼容性。











