ECMAScript 2020 引入了一个新的 nullish coalescing operator（空值合并运算符），这个运算符可以帮助我们更轻松、更直观地处理 null 和 undefined 的情况。本文将详细介绍这个运算符的使用方法，并提供一些示例代码以帮助读者更好地理解。
什么是 nullish coalescing operator
nullish coalescing operator 由两个问号组成：??。它的功能类似于逻辑或运算符 ||，但是它只对 null 和 undefined 进行判断。
这里有一个示例，可以更好地了解它的作用：
const foo = null ?? "bar"; console.log(foo); // "bar" const baz = "foo" ?? "bar"; console.log(baz); // "foo" const qux = undefined ?? "bar"; console.log(qux); // "bar"
在第一个例子中，我们把 null 赋值给了 foo，但是使用 ?? 运算符，把 foo 赋值为 bar。在第二个例子中，foo 已经有了一个有效的值，所以 ?? 运算符没有作用。在第三个例子中，undefined 被认为是nullish，所以 qux 的值也会被赋值为 bar。
nullish coalescing operator 的应用
接下来，我们将讨论几种使用 nullish coalescing operator 的方法。
设置默认参数
通常情况下，我们需要给一个函数设置一个默认参数，这时候我们可以使用 nullish coalescing operator 来判断参数是否为空，并设置一个默认值。
function greet(name, age) {
name = name ?? "friend";
age = age ?? "unknown";
console.log(`Hello, ${name}! You are ${age} years old.`);
}
greet(); // Hello, friend! You are unknown years old.
greet("Alice", 30); // Hello, Alice! You are 30 years old.
greet("Bob"); // Hello, Bob! You are unknown years old.在这个例子中，我们定义了一个函数 greet，并在函数里面使用了 ?? 运算符来设置默认值。当调用 greet()，name 和 age 的默认值就会被赋值为 friend 和 unknown。而当调用 greet("Alice", 30) 或 greet("Bob") 等时，name 和 age 的值就会按照传递的参数来赋值。
获取嵌套对象的值
在处理嵌套对象时，可能会有一些子属性没有被赋值，这种情况下我们可以使用 nullish coalescing operator 来获取默认值。
const obj = { a: { b: 1 } };
const c = obj.a.c ?? "undefined";
console.log(c); // "undefined"这里，我们定义一个嵌套的对象 obj，并且给它的子属性 a 设置了一个值 1。当使用 nullish coalescing operator 来获取子属性 c 的值时，由于该属性不存在，c 的值会被赋值为 undefined。
运算符的类型转换
在进行类型转换时，nullish coalescing operator 的行为不同于逻辑或运算符 ||。当使用 || 运算符时，JavaScript 会进行类型转换，将空值、0、空字符串等转换成布尔值，这种情况下可能会产生一些意外的行为：
const foo = ""; const bar = foo || "default"; console.log(bar); // "default";
使用 || 进行类型转换时，在 foo 的值为空时，foo || "default" 会被转换为 false || "default"，而 false 被认为是一个“假值”，因此 bar 的值会被赋值为 "default"。
相比之下，nullish coalescing operator 对空值、0、空字符串的处理更为严格，只判断 null 和 undefined 部分。换句话说，只有在 null 或 undefined 的情况下，nullish coalescing operator 才会赋值默认值。
const foo = 0; const bar = foo ?? "default"; console.log(bar); // 0
在这个例子中，我们将 foo 的值设置为 0，使用 ?? 运算符进行类型转换，foo ?? "default" 会被转换为 0 ?? "default"，nullish coalescing operator 只关心 null 和 undefined 的情况，这时候 bar 的值就会被赋值为 0。
结论
nullish coalescing operator 是 ECMAScript 2020 中一个非常实用的新运算符，它可以帮助我们更加方便地处理 null 和 undefined 的情况。在编写 JavaScript 代码时，nullish coalescing operator 能够减少我们的工作量，减少代码的复杂度。
在使用这个运算符时，我们需要注意它和逻辑或运算符 || 的区别，避免出现意外的行为。同时，我们可以利用 nullish coalescing operator 对默认参数、嵌套对象、类型转换进行处理，使得代码更加简洁、易读、易维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6750e648050cf9039c1790dd