在前端开发中，经常会遇到需要访问对象的属性或方法的情况。但是，在实际开发中，我们可能会遇到对象属性未定义的情况，这时候如果直接访问该属性，就会出现错误。为了解决这个问题，ES10 提供了一种新的语法：Optional Chaining。
Optional Chaining 是什么？
Optional Chaining 是 ES10 新增的语法，它可以帮助我们避免访问未定义的属性或方法时出现错误。使用 Optional Chaining，我们可以在访问属性或方法时，判断对象是否存在该属性或方法，如果存在就返回属性或方法的值，否则返回 undefined。
Optional Chaining 的使用方法
Optional Chaining 的语法非常简单，只需要在对象的属性或方法后加上问号（?）即可。例如：
-- -------------------- ---- -------
----- ------ - -
----- ------
---- ---
-------- -
----- ----------
------- ----- -------
-
--
---------------------------------- -- ---------
------------------------------------- -- ---------在上面的例子中，我们使用 Optional Chaining 来访问 person 对象的 address 属性中的 city 和 zipCode 属性。当 address 属性存在时，我们可以正常访问 city 属性，并返回其值。当 zipCode 属性不存在时，我们使用 Optional Chaining，访问 zipCode 属性时返回 undefined。
Optional Chaining 的深度使用
Optional Chaining 不仅可以用于访问对象的一级属性，还可以用于访问对象的多级属性。例如：
-- -------------------- ---- -------
----- ------ - -
----- ------
---- ---
-------- -
----- ----------
------- ----- --------
--------- -
--------- --------
---------- --------
-
-
--
------------------------------------------------ -- -------
------------------------------------------------- -- --------
------------------------------------------------ -- ---------在上面的例子中，我们使用 Optional Chaining 来访问 person 对象的 address 属性中的 location 属性中的 latitude、longitude 和 altitude 属性。当 latitude 和 longitude 属性存在时，我们可以正常访问它们，并返回其值。当 altitude 属性不存在时，我们使用 Optional Chaining，访问 altitude 属性时返回 undefined。
Optional Chaining 的指导意义
使用 Optional Chaining 可以帮助我们避免访问未定义的属性或方法时出现错误，提高代码的健壮性和可维护性。在实际开发中，我们可以在访问对象的属性或方法时，使用 Optional Chaining 进行判断，避免因为属性或方法未定义而导致程序出错。
示例代码
下面是一个使用 Optional Chaining 的示例代码：
-- -------------------- ---- -------
----- ------ - -
----- ------
---- ---
-------- -
----- ----------
------- ----- --------
--------- -
--------- --------
---------- --------
-
-
--
-------- ------------------ -
------ --------------------- - ------------------------
-
-------------------------------- -- ------------ -------在上面的示例代码中，我们定义了一个 getAddress 函数，用于获取人的地址。使用 Optional Chaining，我们可以在访问 person 对象的 address 属性中的 city 和 street 属性时，避免因为属性未定义而导致程序出错。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d2dceea941bf7134590b48
