ES2021 中的 Logical nullish assignment 表达式-JavaScript中文网-JavaScript教程资源分享门户

在 ES2021 中，新增了一个运算符 ??=，也称为 Logical nullish assignment 表达式。这个运算符可以方便地对变量赋值，同时避免了一些常见的错误。

什么是 Logical nullish assignment 表达式？

Logical nullish assignment 表达式是一个组合运算符，包括了 Nullish Coalescing 运算符 ?? 和赋值运算符 =。它的作用是在变量为 null 或 undefined 时，才对其进行赋值。

在 JavaScript 中，我们经常会使用 || 运算符来给变量赋默认值，例如：

const name = inputName || 'Anonymous';

但是这种方式有一个问题，当 inputName 的值为 false 或 0 时，都会被视为未定义的值，从而导致默认值被错误地赋予给变量。为了避免这个问题，我们可以使用 Logical nullish 运算符 ?? 来判断变量是否为 null 或 undefined，例如：

const name = inputName ?? 'Anonymous';

但是这种方式还有一个问题，当我们需要给一个变量赋默认值并且更新它的值时，就需要写两行代码，例如：

let count = getCountFromServer();
if (count === null || count === undefined) {
  count = 0;
}

这样的代码显得冗长且不够优雅。为了解决这个问题，我们可以使用 Logical nullish assignment 运算符 ??=，例如：

let count = getCountFromServer();
count ??= 0;

这样的代码更加简洁且易读。

Logical nullish assignment 表达式的语法如下：

variable ??= value;

其中，variable 是要赋值的变量，value 是默认值。如果 variable 的值为 null 或 undefined，则将 value 赋给它。

下面是一个使用 Logical nullish assignment 表达式的示例代码：

let x;
x ??= 10;
console.log(x); // 10

let y = 5;
y ??= 10;
console.log(y); // 5

在这个示例中，当变量 x 的值为 null 或 undefined 时，将 10 赋给它；而当变量 y 的值不为 null 或 undefined 时，不会对它进行赋值。

Logical nullish assignment 表达式是 ES2021 中新增的一个运算符，它可以方便地对变量赋值，并避免了一些常见的错误。使用 Logical nullish assignment 表达式可以使代码更加简洁、易读，并提高代码的可维护性。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/657c8663d2f5e1655d759271