在 JavaScript 中，我们经常需要检查一个变量是否为 null 或者 undefined，然后才能进行下一步操作，这个过程非常的繁琐，而且容易出错。ES11 中，Nullish Coalescing Operator 的出现，让这个过程变得更加简单和方便。
Nullish Coalescing Operator 是什么？
Nullish Coalescing Operator 是一个新的操作符，也被称为双问号操作符（??），它允许我们轻松地检查一个变量是否为 null 或 undefined，并在变量为 null 或 undefined 时提供默认值。
Nullish Coalescing Operator 的语法非常简单：
const result = variable ?? defaultValue;
如果 variable 是 null 或 undefined，则 result 的值为 defaultValue，否则 result 的值为 variable 的值。
Nullish Coalescing Operator 与 || 的区别
在 JavaScript 中，|| 也可以用于提供默认值，但是 || 运算符的行为与 Nullish Coalescing Operator 有所不同。
|| 运算符在变量为 0、空字符串、false、null 或 undefined 时，都会返回默认值。而 Nullish Coalescing Operator 只在变量为 null 或 undefined 时返回默认值。
举个例子：
// javascriptcn.com 代码示例 const a = 0; const b = ''; const c = false; const d = null; const e = undefined; console.log(a || 'default'); // 'default' console.log(b || 'default'); // 'default' console.log(c || 'default'); // 'default' console.log(d || 'default'); // 'default' console.log(e || 'default'); // 'default' console.log(a ?? 'default'); // 0 console.log(b ?? 'default'); // '' console.log(c ?? 'default'); // false console.log(d ?? 'default'); // 'default' console.log(e ?? 'default'); // 'default'
Nullish Coalescing Operator 的应用
Nullish Coalescing Operator 可以用于许多场景，比如为函数参数提供默认值：
// javascriptcn.com 代码示例
function greet(name, age) {
const finalName = name ?? 'Anonymous';
const finalAge = age ?? 18;
console.log(`Hello, ${finalName}! You are ${finalAge} years old.`);
}
greet('Alice', 20); // Hello, Alice! You are 20 years old.
greet(null, 20); // Hello, Anonymous! You are 20 years old.
greet('Bob', null); // Hello, Bob! You are 18 years old.
greet(null, null); // Hello, Anonymous! You are 18 years old.Nullish Coalescing Operator 还可以用于处理对象的属性：
const person = {
name: 'Alice',
age: null,
};
console.log(person.name ?? 'Anonymous'); // Alice
console.log(person.age ?? 18); // 18总结
Nullish Coalescing Operator 是一个非常有用的操作符，可以让我们轻松地检查一个变量是否为 null 或 undefined，并提供默认值。与 || 运算符相比，Nullish Coalescing Operator 更加精确，只在变量为 null 或 undefined 时返回默认值。在实际开发中，我们可以大量地使用 Nullish Coalescing Operator，使代码更加简洁和易读。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6559acddd2f5e1655d4164b0