ECMAScript 2020 中引入了 Nullish Coalescing 运算符，它可以帮助我们更方便地处理 null 或 undefined 的情况。在本文中，我们将对 Nullish Coalescing 运算符进行详细的介绍，并讨论它的应用场景。
Nullish Coalescing 运算符
Nullish Coalescing 运算符是双问号运算符（??），它可以用来判断一个变量是否为 null 或 undefined，并在变量为 null 或 undefined 时返回一个默认值。它的语法如下：
const result = variable ?? defaultValue;
其中，variable 是要进行判断的变量，defaultValue 是默认值。如果 variable 的值为 null 或 undefined，则返回 defaultValue，否则返回 variable 的值。
与传统的逻辑或运算符（||）不同，Nullish Coalescing 运算符只在变量为 null 或 undefined 时返回默认值，而不是在变量为假值时返回默认值。例如：
-- -------------------- ---- ------- ----- - - ----- ----- - - ---------- ----- - - -- ----- - - --- ------------- -- ----------- -- --------- ------------- -- ----------- -- --------- ------------- -- ----------- -- - ------------- -- ----------- -- --------- ------------- -- ----------- -- --------- ------------- -- ----------- -- --------- ------------- -- ----------- -- - ------------- -- ----------- -- --
在上面的例子中，a 和 b 的值为 null 和 undefined，使用逻辑或运算符时都会返回默认值。而使用 Nullish Coalescing 运算符时，它们也会返回默认值。而 c 和 d 的值为 0 和空字符串，使用逻辑或运算符时只有空字符串会返回默认值，而使用 Nullish Coalescing 运算符时都不会返回默认值。
应用场景
Nullish Coalescing 运算符可以用来处理许多场景，例如：
1. 设置默认值
当我们需要设置一个变量的默认值时，可以使用 Nullish Coalescing 运算符。例如：
const name = getName() ?? 'Guest';
在上面的例子中，如果 getName() 返回 null 或 undefined，则 name 的值将被设置为 'Guest'。
2. 避免错误
在访问对象属性或数组元素时，如果对象或数组不存在，会抛出错误。可以使用 Nullish Coalescing 运算符来避免这种错误。例如：
const person = {
name: 'John',
age: 30
};
const city = person.address?.city ?? 'Unknown';在上面的例子中，如果 person 对象没有 address 属性，或 address 属性的值为 null 或 undefined，则 city 的值将被设置为 'Unknown'。
3. 链式调用
在链式调用中，如果中间的对象不存在，会抛出错误。可以使用 Nullish Coalescing 运算符来避免这种错误。例如：
const result = person?.address?.city ?? 'Unknown';
在上面的例子中，如果 person 对象或 address 属性不存在，或它们的值为 null 或 undefined，则 result 的值将被设置为 'Unknown'。
总结
Nullish Coalescing 运算符是 ECMAScript 2020 中引入的新运算符，它可以帮助我们更方便地处理 null 或 undefined 的情况。它与传统的逻辑或运算符不同，只在变量为 null 或 undefined 时返回默认值。Nullish Coalescing 运算符可以用来设置默认值、避免错误和链式调用等场景。在实际开发中，我们应该根据具体情况灵活使用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/658e4cb6eb4cecbf2d41ba34