介绍
最近,ECMAScript 2021(即 ES12)正式发布了。其中一个新的特性是 Nullish 合并运算符(Nullish coalescing operator),它能够更简洁地处理 JavaScript 中空值的情况。本文将介绍 Nullish 合并运算符的概念、使用方法和相关注意事项。
同时,本文还将介绍如何在 Node.js 中使用 Nullish 合并运算符,给出示例代码,以便读者可以更好地了解 Nullish 合并运算符在实际项目中的应用。
Nullish 合并运算符的概念
首先,我们来了解 Nullish 合并运算符的概念。简而言之,Nullish 合并运算符是一种类似于逻辑或(||)的运算符,但它只在左侧的值为 null 或 undefined 时才会返回右侧的值。如果左侧的值为其他 falsy 值(如 0、'' 或 false),它并不会返回右侧的值。
例如,我们可以使用 Nullish 合并运算符来简化以下代码:
-- -------------------- ---- ------- ----- --- - - -- -- -- --- -- ----- - ----- - - ----- -- --------- ----- - - ----- -- --------- ----- - - ----- -- --------- -------------- -- -- -- ---------- ------- -------
上面的代码中,我们试图从一个值为对象的变量 foo 中获取三个属性的值。由于属性 a、b 和 c 对应的值分别是 0、'' 和 false,它们都被转换为 falsy 值,导致 || 操作符会返回右侧的 'default' 值。因此,我们得到的 x、y 和 z 都是 'default'。
但是,如果我们想让 Nullish 合并运算符返回右侧的值 only when 左侧是 null 或 undefined 呢?这时候可以这样写:
-- -------------------- ---- ------- ----- --- - - -- -- -- --- -- ----- - ----- - - ----- -- --------- ----- - - ----- -- --------- ----- - - ----- -- --------- -------------- -- -- -- ---- -- -----
这里我们将 || 替换为 ??,输出结果就不一样了。现在,只有 a、b 和 c 对应的值为 null 或 undefined 时,我们才会得到相应的默认值。在这个例子中,我们得到的是 0、'' 和 false,因为它们都是真值。
使用 Nullish 合并运算符的注意事项
虽然 Nullish 合并运算符很方便,但在使用它时需要注意以下几点。
1. 嵌套使用
由于 Nullish 合并运算符只返回左侧值为 null 或 undefined 时的默认值,不处理其他 falsy 值,因此如果左侧的值是包含了 falsy 值的对象或数组,它很可能会返回不符合预期的结果。
-- -------------------- ---- ------- ----- --- - - -- -- -- --- -- ------ -- ---- - ----- - - ----- -- --------- ----- - - ----- -- --------- ----- - - ----- -- --------- ----- - - ----- -- --------- -------------- -- -- -- -- ---- -- ----- -------
在上述代码中,我们加入了一个为 null 的 foo.d 属性。由于 Nullish 合并运算符只检查左侧的 null 或 undefined,因此它仍然返回 'default'。
如要确保在处理包含 falsy 值的数组或对象时正确使用 Nullish 合并运算符,您可以使用一些其他技术。例如,您可以使用递归函数或其它方法来逐步检查包含在数组或对象中的属性或元素值。这可以帮助确保预期的默认值将在存在 falsy 值时返回。
2. 不要与并集运算符混淆
另一个需要注意的事项是,不要将 Nullish 合并运算符与 || 运算符混淆。
|| 运算符是在两侧的值均为 falsy 时返回右侧的值。这意味着如果您在使用 || 运算符时意外使用了空字符串、0 或 false 值而不是 null 或 undefined,您可能会遇到不正确的行为。然而,使用 Nullish 合并运算符则不会导致此类问题出现。
在 Node.js 中使用 Nullish 合并运算符
在 Node.js 中使用 Nullish 合并运算符和在浏览器中使用它非常相似,无需进行任何特殊的配置或安装。但在内部引入 Nullish 合并运算符时,您需要确保在运行时使用具有 ES12 支持的版本的 Node.js。
下面是在 Node.js 中使用 Nullish 合并运算符的示例代码:
const port = process.env.PORT ?? 8080 console.log(port)
在上面的代码中,我们可以看到用在环境变量获取上。当变量 process.env.PORT 不存在或者是 null/undefined 值时,才会使用默认值。
另请注意,由于许多版本的 Node.js 尚未包含对 Nullish 合并运算符的支持,因此您可能需要启用特殊的 Babel 插件或使用其他工具来转换您的代码。了解这些转换工具确保您在使用平台或库时采取必要的措施,以确保您的代码能够运行。
Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/67d6dbfaa941bf7134cbac5f