在 ECMAScript 2021 中，新增了一个 Nullish Coalescing 运算符，即 ??。这个运算符主要用来判断一个值是否为 null 或 undefined，如果是的话，就使用另一个给定的默认值代替它。
Nullish Coalescing 运算符的使用
下面是一个简单的例子，展示了如何使用 Nullish Coalescing 运算符：
----- --- - ---- -- ------ ------- ----------------- -- ------ ------
在上述代码中，foo 的值为 null，因此使用了 "hello world" 作为默认值。
如果去掉 Nullish Coalescing 运算符，可以得到以下代码：
----- --- - ---- -- ------ ------- ----------------- -- ------ ------
在上面的代码中，使用了逻辑或运算符 ||，这样的话，如果 foo 的值为 falsy，就会使用右侧的默认值。但是，由于空字符串、0、false 等值在逻辑运算时会被当作 falsy 值，因此无法区分 null 和 undefined。
Nullish Coalescing 运算符准确地区分了 null 或 undefined 和其他 falsy 值，因此可以更精确地判断变量的值。
Nullish Coalescing 运算符与逻辑或运算符的区别
虽然 Nullish Coalescing 运算符看起来很像逻辑或运算符，但是它们有一个很重要的区别。当使用逻辑或运算符时，只要左侧运算结果为 falsy，就会返回右侧的默认值。但是使用 Nullish Coalescing 运算符时，只有当左侧运算结果为 null 或 undefined 时，才会返回右侧的默认值。
下面是一个例子，用来展示区别：
----- - - ---------- ----- - - ----- ----- - - -- ----- --- - - -- ------ ------- ----- --- - - -- ------ ------- ----- --- - - -- ------ ------- ----- ---------- - - -- ------ ------- ----- ---------- - - -- ------ ------- ----- ---------- - - -- ------ ------- ----------------- -- ------ ------ ----------------- -- ------ ------ ----------------- -- ------ ------ ------------------------ -- ------ ------ ------------------------ -- ------ ------ ------------------------ -- -
在上述代码中，变量 a 和 b 的值分别为 undefined 和 null，变量 c 的值为 0。使用逻辑或运算符时，foo 和 bar 都返回默认值 "hello world"，因为它们的值为 falsy。而使用 Nullish Coalescing 运算符时，只有 bazNullish 返回变量 c 的值 0，其他变量均返回默认值 "hello world"。
Nullish Coalescing 运算符的使用场景
Nullish Coalescing 运算符常常用于判断变量值是否为 null 或 undefined，从而决定是否使用默认值。
例如，当使用 API 请求获取数据时，可能会得到一个空值。使用 Nullish Coalescing 运算符时，就可以使用一个默认值替代空值，从而避免出现 bug：
----- ---- - ----------- -- - -------- ------------- --
在上述代码中，如果 fetchData() 返回 null 或 undefined，就会使用默认值 { message: "请求出错，请稍后再试。" }。
另一个使用场景是在不使用默认值的情况下，获得正确的结果。例如：
----- - - --- ----- - - --- ----- ------ - - -- -- -------------------- -- --
在上述代码中，使用 Nullish Coalescing 运算符时，返回了变量 x 的值 ""，因为它不是 null 或 undefined。
结论
Nullish Coalescing 运算符可以帮助开发者更精确地判断变量值是否为 null 或 undefined，并使用默认值代替空值。它比逻辑或运算符更加准确，避免了空字符串、0、false 等值被当作 falsy 值的问题。在 API 请求、函数返回值等场景下，Nullish Coalescing 运算符可以帮助我们避免出现 bug，提高代码质量。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6719becd3af17e55073249e4