在前端开发中，我们经常会遇到需要访问深层嵌套对象的情况，例如：
----- ---- - -
----- -------
---- ---
-------- -
------- ---- ---- ----
----- ---- ------
------ -----
---- -------
-
-
----- ------- - ---------------- -- -------但是，如果对象中存在某个属性为空或未定义，如：
----- ---- - - ----- ------- ---- --- -------- ---- - ----- ------- - ---------------- -- ---------- ------ ---- -------- ----- -- ----
就会导致代码出现错误，需要手动加入判断语句，如：
----- ------- - ------------ - ---------------- - ---------
这样的写法虽然能够避免错误，但是代码变得复杂难读，特别是在访问多层嵌套对象时更是如此。
ES11 的 Optional Chaining 语法就是为了解决这个问题而生的。
Optional Chaining 语法
Optional Chaining 语法使用 ?. 操作符来访问嵌套对象属性，如果对象或属性不存在，就会返回 undefined，而不是抛出错误。例如：
----- ------- - ----------------- -- ---------
如果 user.address 不存在，就直接返回 undefined，不需要手动加入判断语句。
Optional Chaining 语法也支持访问数组元素，例如：
----- --- - --- -- -- ----- ----- - -------- -- -
如果数组不存在或者对应下标的元素不存在，就会返回 undefined。
Optional Chaining 语法还支持函数调用，例如：
----- ---- - -
----- -------
---- ---
------------ -
------ ------------
-
-
----- ------- - ----------------------- -- ---------如果 getAddress 方法不存在，就会直接返回 undefined，不会抛出错误。
使用示例
下面是一个使用 Optional Chaining 语法的示例代码：
----- ---- - -
----- -------
---- ---
-------- -
------- ---- ---- ----
----- ---- ------
------ -----
---- -------
-
-
----- ------- - ----------------- -- -------
-------------------- -- -------在这个示例中，我们使用 Optional Chaining 语法来访问 user.address.zip，如果 user.address 不存在，就会返回 undefined。
总结
Optional Chaining 语法是 ES11 引入的一个非常实用的特性，能够帮助我们避免代码复杂度，提高代码的可读性和可维护性。在访问深层嵌套对象时，我们可以优先考虑使用 Optional Chaining 语法来简化代码，提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/663ec4bad3423812e4d011f2