ECMAScript 2021 中的新特性：Nullish Coalescing 运算符，解决 JS 中的 undefined 问题

在 JavaScript 中，当一个变量的值为 null 或 undefined 时，我们通常使用 || 运算符来给变量赋予默认值。但是在某些情况下，这种方法并不适用。ECMAScript 2021 中的 Nullish Coalescing 运算符能够帮助我们解决这些问题。

什么是 Nullish Coalescing 运算符？

Nullish Coalescing 运算符是 ECMAScript 2021 中新增的一种运算符，它使用 ?? 表示。与 || 运算符不同的是，Nullish Coalescing 运算符只会在变量值为 null 或 undefined 时才会触发默认值赋值。

基本语法如下：

const result = A ?? B;

如果 A 的值为 null 或 undefined，则表达式的结果为 B，否则表达式的结果为 A。

Nullish Coalescing 运算符的优势

使用 || 运算符来给变量赋予默认值存在一些限制。当一个变量的值为空字符串、false 或数字 0 时，|| 运算符会将其作为 falsy 值处理，进而赋予默认值。这通常不是我们想要的结果。

例如，当以下代码运行时：

const foo = null || 'default value';
console.log(foo);

控制台打印的结果是：

default value

而当以下代码运行时：

const bar = '' || 'default value';
console.log(bar);

控制台打印的结果是：

default value

这并不符合我们期望的结果。使用 Nullish Coalescing 运算符就能够避免这种情况。

Nullish Coalescing 运算符的使用场景

Nullish Coalescing 运算符通常用于给变量赋予默认值。例如，当一个函数的参数值为 null 或 undefined 时，我们可以使用 Nullish Coalescing 运算符来给参数赋予默认值。

以下是一个示例代码：

function func(a, b) {
  const paramA = a ?? 'defaultA';
  const paramB = b ?? 'defaultB';
  console.log(paramA, paramB);
}

func();          //输出: defaultA  defaultB
func('valueA');   //输出: valueA    defaultB
func(null, 'valueB'); //输出: defaultA  valueB

使用 Nullish Coalescing 运算符能够更精确地判断变量是否为空，从而避免非预期结果的发生。

总结

Nullish Coalescing 运算符是 ECMAScript 2021 中的新特性，它能够帮助我们更准确地判断变量是否为空并给变量赋予默认值。与 || 运算符不同的是，Nullish Coalescing 运算符只会在变量值为 null 或 undefined 时才会触发默认值赋值，从而避免了一些非预期结果的发生。在实际开发中，我们可以将 Nullish Coalescing 运算符应用于给函数参数等场景，提升代码的可读性和可维护性。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65a7b6fdadd4f0e0ff0dc84b