在前端开发中，我们经常需要处理数据结构，比如嵌套对象和数组。在访问嵌套对象或者数组元素时，如果数据结构中某个属性或者元素不存在，那么就会出现 undefined 的情况，这时候我们需要进行一些判断和处理。在 ES11 中，新增了可选链和链判断运算符，可以很方便地处理这种情况。
可选链
可选链是一个非常实用的特性，它可以避免在访问嵌套对象或者数组元素时出现 undefined 的情况。它的语法如下：
--------- -- ------ ------------ -- ------
其中，?. 表示可选链，如果 obj 或者 arr 为 null 或者 undefined，那么访问 prop 或者 index 就会返回 undefined，而不会抛出错误。如果 obj 或者 arr 存在，那么就会正常访问属性或者元素。
下面是一个示例代码：
----- ------ - -
----- ------
-------- -
----- ----------
------- --------- -----
-
-
---------------------------------- -- ---------
------------------------------------- -- ---------在上面的示例中，我们使用了可选链来访问 person 对象中的 address 属性和 city 属性。由于 person 对象中存在 address 属性，所以访问 address 属性不会出错。而由于 person 对象中不存在 country 属性，所以访问 country 属性会返回 undefined。
链判断运算符
链判断运算符也是一个非常实用的特性，它可以更加方便地进行链式访问和判断，避免出现 undefined 的情况。它的语法如下：
---------------------------
其中，?. 表示可选链，如果 obj 或者 prop1 或者 prop2 为 null 或者 undefined，那么访问 method 就会返回 undefined，而不会抛出错误。如果 obj 或者 prop1 或者 prop2 存在，那么就会正常访问属性或者方法。
下面是一个示例代码：
----- ------ - -
----- ------
-------- -
----- ----------
------- --------- -----
--
---------- -
------------------- -- ---- -- --------------
-
-
----------------------------- -- ------- -- ---- -- ----在上面的示例中，我们使用了链判断运算符来访问 person 对象中的 address 属性和 sayHello 方法。由于 person 对象中存在 address 属性和 sayHello 方法，所以访问不会出错。而由于 person 对象中不存在 country 属性，所以访问 country 属性会返回 undefined。
总结
可选链和链判断运算符是 ES11 中非常实用的特性，它们可以避免在访问嵌套对象或者数组元素时出现 undefined 的情况，从而简化了代码的编写和调试。在实际开发中，我们可以充分利用这些特性，提高代码的可读性和健壮性。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/658901d2eb4cecbf2de30633