JavaScript 是一门灵活的语言，但由于其动态特性，处理 null 或 undefined 的代码往往让开发者头痛。为了解决这个问题，JavaScript 提供了 Optional Chaining 和空值合并运算符，它们可以简化代码，提高开发效率。
什么是 Optional Chaining？
Optional Chaining 也就是可选链，它是一种新的语法特性，可以帮助处理 JavaScript 中的空值。当我们需要多次访问对象的属性或方法时，我们可以使用 ?. 操作符而不必明确验证每个中间变量是否为 null 或 undefined。
就像这样：
const user = {
name: 'Alice',
address: null
};
const city = user.address && user.address.city;
console.log(city); // 输出: undefined在这个例子中，我们想要获取 user 对象内的地址城市信息，但是由于地址信息为空，我们不能直接获取。通过可选链的方式，改写如下：
const city = user?.address?.city; console.log(city); // 输出: undefined
这样就可以避免出现 TypeError 错误了。Optional Chaining 的实现原理是判断变量是否为 null 或 undefined，如果是就直接返回 undefined。
什么是空值合并运算符？
空值合并运算符也是一种新的语法特性，它可以让我们更方便地处理空值。在 JavaScript 中，有时候我们需要处理空值，但是这个过程会变得很繁琐。
比如要处理一个变量，但是不确定它是否为 undefined 或是 null：
let name;
if (inputName === null || inputName === undefined) {
name = "暂无姓名";
} else {
name = inputName;
}这样的代码看起来很冗长。而通过空值合并运算符，可以将这个逻辑简化：
const name = inputName ?? "暂无姓名";
这样，如果 inputName 的值为 null 或 undefined，那么 name 的值就会是 “暂无姓名”，否则就是 inputName 的值。
如何使用 Optional Chaining 和空值合并运算符？
下面是一些使用示例：
-- -------------------- ---- -------
----- ---- - -
----- --------
-------- ----
--
------------------------------- -- -------------
----- -------- - -
----- -----
--
--------------------------- -- -------------在这个例子中，我们尝试访问用户的城市信息和电话信息。如果节点不存在就直接返回 'undefined'，如果节点存在但没有信息就返回默认值。
总结
Optional Chaining 和空值合并运算符是 JavaScript 中很实用的新特性。它们可以帮助我们更优雅地处理 JavaScript 中的空值，提高代码的可读性和易用性。在 ES11 中获得全面推广，建议开发者尽早使用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64b0ac5f48841e9894cc1eb4