空值合并运算符??是ES2020引入的二元操作符，仅当左操作数为null或undefined时返回右操作数，对0、false、''、NaN等falsy值仍返回左操作数；其与||的关键区别在于??只检测nullish值，而||检测所有falsy值。
空值合并运算符 ?? 是什么
它是一个二元操作符，只在左操作数为 null 或 undefined 时返回右操作数；其他任何值（包括 0、false、''、NaN）都会原样返回左操作数。
?? 和 || 的关键区别在哪里
很多人误以为 ?? 是“更安全的 ||”，其实它们的判断逻辑完全不同：
-
||检查的是“falsy 值”：只要左值是false、0、''、null、undefined、NaN，就取右边 -
??只检查“nullish 值”：仅当左值严格等于null或undefined才取右边
这意味着你写 count ?? 10，哪怕 count 是 0，结果也是 0；而 count || 10 在 count === 0 时会错误地返回 10。
常见误用场景和修复建议
典型问题出现在处理 API 返回的可选数值或布尔字段时：
Plan Dubai Travel — Flights, Hotels, Burj Khalifa, Desert Safari, Malls & Itineraries
下载
规划您的迪拜之旅 — 哈利法塔观景、沙漠探险、迪拜购物中心购物、棕榈岛度假村及黄金市场砍价。还提供支持...
立即学习“Java免费学习笔记（深入）”；
- 后端返回
{ price: 0 }，但代码写成item.price || 99→ 错误覆盖为99 - 正确写法应为
item.price ?? 99，保留0的业务含义 - 嵌套访问如
user?.profile?.age ?? 18安全且简洁；不用再写(user && user.profile && user.profile.age) || 18 - 注意优先级：
a ?? b || c等价于(a ?? b) || c，不是a ?? (b || c)；混用时建议加括号明确意图
浏览器兼容性和替代方案
?? 是 ES2020 特性，现代浏览器（Chrome 80+、Firefox 74+、Safari 13.1+）已原生支持。如果需兼容旧环境：
- 用 Babel +
@babel/plugin-proposal-nullish-coalescing-operator - TypeScript 3.7+ 默认支持，并在编译时降级为三元表达式（如
a !== null && a !== void 0 ? a : b） - 手写兼容写法：
(val === null || val === undefined) ? defaultValue : val，但别为了省几字节牺牲可读性
const config = {
timeout: response.data.timeout ?? 5000,
retries: response.data.retries ?? 3,
enabled: response.data.enabled ?? true // 即使后端没传 enabled 字段，也不影响默认 true
};
真正容易被忽略的是：它不解决深层属性缺失导致的 TypeError，必须配合可选链 ?. 使用；单独写 obj.items[0].name ?? 'N/A' 在 obj.items 为空时仍会报错。
