空值合并运算符 '??' 与 || 比较

空值合并运算符 '??' 与 || 比较

https://zh.javascript.info/nullish-coalescing-operator

或运算符 || 可以以与 ?? 运算符相同的方式使用。

`
let firstName = null;
let lastName = null;
let nickName = "Supercoder";

// 显示第一个真值：
alert(firstName || lastName || nickName || "Anonymous"); // Supercoder
`

纵观 JavaScript 发展史，或 || 运算符先于 ?? 出现。它自 JavaScript 诞生就存在了，因此开发者长期将其用于这种目的。

另一方面，空值合并运算符 ?? 是最近才被添加到 JavaScript 中的，它的出现是因为人们对 || 不太满意。

它们之间重要的区别是：

|| 返回第一个 真 值。
?? 返回第一个 已定义的 值。
换句话说，|| 无法区分 false、0、空字符串 "" 和 null/undefined。它们都一样 —— 假值（falsy values）。如果其中任何一个是 || 的第一个参数，那么我们将得到第二个参数作为结果。

不过在实际中，我们可能只想在变量的值为 null/undefined 时使用默认值。也就是说，当该值确实未知或未被设置时。

例如，考虑下面这种情况：
`
let height = 0;

alert(height || 100); // 100
alert(height ?? 100); // 0
`
height || 100 首先会检查 height 是否为一个假值，它是 0，确实是假值。
所以，|| 运算的结果为第二个参数，100。
height ?? 100 首先会检查 height 是否为 null/undefined，发现它不是。
所以，结果为 height 的原始值，0。
实际上，高度 0 通常是一个有效值，它不应该被替换为默认值。所以 ?? 运算得到的是正确的结果。

总结

空值合并运算符 ?? 提供了一种从列表中选择第一个“已定义的”值的简便方式。

它被用于为变量分配默认值：

// 当 height 的值为 null 或 undefined 时，将 height 的值设置为 100
height = height ?? 100;
?? 运算符的优先级非常低，仅略高于 ? 和 =，因此在表达式中使用它时请考虑添加括号。

如果没有明确添加括号，不能将其与 || 或 && 一起使用。