在前端开发中，我们常常需要处理各种数据。有时候我们需要访问一个深层次的对象或数组的某个属性或元素，但是却不确定这个对象或数组是否存在。在 ES2020 中，加入了链判断运算符（Optional Chaining Operator）和 Nullish Coalescing 运算符（空合并运算符），它们为我们简化了许多代码，提高了开发效率。
链判断运算符
在 ES2020 之前，如果我们需要获取一个深层次的对象或数组的某个属性或元素时，我们通常需要进行一系列的判断，如下所示：
let result = null;
if (obj && obj.prop1 && obj.prop1.prop2 && obj.prop1.prop2.prop3) {
result = obj.prop1.prop2.prop3;
}这样的代码很容易出现嵌套，代码量也较大，而且一旦对象结构发生变化，代码也需要跟着修改。
在 ES2020 中，我们可以使用链判断运算符（?.），它可以简化上述代码的写法。链判断运算符可以在对象属性或数组元素为 null 或 undefined 时，立即停止表达式求值，返回 undefined，而不会导致 TypeError 错误。
const result = obj?.prop1?.prop2?.prop3;
这样的代码看起来简洁很多，而且不需要进行条件判断，代码也更容易维护，但是在使用链判断运算符的时候，需要注意以下几点：
一定要在对象或数组上使用，而不能在变量或函数调用上使用。
这个运算符不会捕捉任何明确抛出的异常。
这个运算符不会访问 undefined 属性或方法的原型链上的任何东西。
这个运算符的最后一项不能是函数或调用。如果是，请使用常规的函数调用语法。
Nullish Coalescing 运算符
在实际应用中，我们经常需要判断一个值是否为 null 或 undefined，并在其为 null 或 undefined 时设置一个默认值。在 ES2020 中，我们可以使用 Nullish Coalescing 运算符（??）来取代以前的逻辑运算符 ||。
以往我们可以使用以下方式来实现上述功能：
let result = null;
if (value !== null || value !== undefined) {
result = value;
} else {
result = 'default value';
}而现在，我们可以使用 Nullish Coalescing 运算符（??）来简化上述代码：
const result = value ?? 'default value';
这样的代码看起来更加直观明了，并且不需要进行条件判断。
需要注意以下几点：
?? 运算符仅在值为 null 或 undefined 时返回默认值，否则返回该值。
?? 运算符不会将 0、空字符串和 false 视为 null 或 undefined
?? 运算符不会将任何字符串转换为布尔值 false。即使一个空字符串也不会。
示例
下面是一个综合应用链判断运算符和 Nullish Coalescing 运算符的示例代码：
-- -------------------- ---- -------
----- ------- - -
----- -
----- --------
--
-------- ----
--
----- -------- - --------------- -- -----
----- ---- - ------------------ -- --------
------------------ -------- --------- -------------- -- ----- ------ --------- ----结论
在 ES2020 中，链判断运算符和 Nullish Coalescing 运算符为我们提供了更加简洁明了的代码编写方式。它们让我们能够更加专注于解决业务问题，而不是被冗长的代码所困扰。但是在使用它们时，我们需要了解并熟悉它们的特性和限制，更好地利用它们来优化代码。
值得一提的是，链判断运算符和 Nullish Coalescing 运算符并不是语言本身的必要部分，许多浏览器可能不支持它们。因此，在实际开发中，需要注意是否需要进行相关兼容性问题的处理。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/670b76bfd91dce0dc88ac468