ECMAScript 2020（ES11）是 JavaScript 语言的最新版本，其中引入了 Nullish coalescing 运算符。这个新运算符可以用来解决在 JavaScript 开发中常见的问题：如何判断一个变量是否为 null 或 undefined，并根据不同的情况执行不同的逻辑。
在本文中，我们将介绍什么是 Nullish coalescing 运算符，并展示如何使用逻辑赋值表达式的 && 和 || 来模拟 Nullish coalescing 的行为。我们还将提供实际的代码示例，帮助读者更好地理解这个新特性。
什么是 Nullish coalescing 运算符
在 JavaScript 中，我们通常使用 || 运算符来判断一个变量是否为 null 或 undefined。例如，下面的代码示例中，变量 name 是一个字符串，如果它为 null 或 undefined，我们会将其赋值为 "default"。
--- ---- - ----- ---- - ---- -- ---------- -- ---- ---- ---------
这个判断的机制看上去是可行的，但是存在一个问题：如果变量的值为 falsy 值时（如空字符串 ""，数字 0，false），那么它也会被判断为 null 或 undefined。例如，下面的代码中，变量 age 被判断为 undefined，尽管它的值实际上是 0。
--- --- - -- --- - --- -- --- -- --- ---- --
为了解决这个问题，ES11 提供了 Nullish coalescing 运算符 ??。这个运算符只有在变量的值为 null 或 undefined 时才返回默认值。例如，可以使用下面的代码来判断变量 name 是否为 null 或 undefined：
--- ---- - ----- ---- - ---- -- ---------- -- ---- ---- ---------
与 || 运算符不同，Nullish coalescing 运算符只有在变量的值为 null 或 undefined 时才返回默认值。如果变量的值为 falsy 值（如空字符串 ""，数字 0，false），则它的值不会被替换为默认值。
使用 && 和 || 模拟 Nullish coalescing
在实际的开发中，我们可能需要在旧代码中使用 Nullish coalescing，而这些代码可能在不升级到 ES11 的情况下运行。幸运的是，我们可以使用 && 和 || 运算符来模拟 Nullish coalescing。
具体来说，我们可以使用下面的代码来模拟 Nullish coalescing 的行为：
--- ---- - ----- ---- - ----- --- ---- -- ---- --- ---------- - ---- - ---------- -- ---- ---- ---------
这个代码的行为与使用 Nullish coalescing 运算符的行为完全一致。在变量为 null 或 undefined 时，它会使用默认值 "default"。
在这个代码中，我们使用了逻辑赋值表达式的 && 和 ||，它们也被称为 null 合并或或合并运算符。具体来说，我们使用 && 运算符来判断变量不为 null 或 undefined，使用 || 运算符来提供默认值。
实际示例
为了更好地理解以上的概念和方法，我们在下面提供一个实际的示例，其中定义了一个函数 getUsername，它用于获取用户的用户名。如果获取失败，它将使用默认值 "guest"。
-------- ----------------- - ----- ---- - ---- -- ---------- ----- -------- - ---- --- ---- -- ---- --- --------- - ---- - -------- ------ --------- - ------------------------- ----- ------- ---- -- -- ------- ------------------------------- -- -- ------- ----------------------------- -- -- -------
以上代码中，我们首先使用了短路运算符 && 来获取 user 对象中的 name 属性，如果 user 为 null 或 undefined，它将返回 undefined。然后，我们使用逻辑赋值表达式的 && 和 || 运算符来完成 Nullish coalescing 的判断。
当 user 的 name 属性为 null 或 undefined 时，我们将返回默认值 "guest"。在这个示例中，我们也可以使用 Nullish coalescing 运算符来实现相同的行为。例如，可以使用如下的代码取代逻辑赋值表达式：
----- -------- - ---- -- --------
总结
本文中，我们介绍了 Nullish coalescing 运算符及其作用，解决了 || 运算符在变量为 falsy 值时的问题。我们还说明了如何使用逻辑赋值表达式的 && 和 || 来模拟 Nullish coalescing 的行为，并提供了实际的代码示例。我们相信，这个新特性在实际的开发中会给读者带来很大的便利，为编写更安全、更健壮的代码提供了帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/65b85a04add4f0e0ff0e1640