在前端开发中，我们经常需要访问对象的属性或方法。然而，由于对象可能不存在某个属性或方法，如果我们直接访问这些属性或方法，很容易出现 undefined 错误。为了避免这种错误，ECMAScript 2020 引入了可选链操作符（Optional Chaining Operator）。
可选链操作符的基本语法
可选链操作符是一个问号加上一个点号 ?.，表示如果左侧的表达式不为 null 或 undefined，就继续访问右侧的属性或方法；否则返回 undefined。
----- --- - -
---- -
---- -
---- ------ ------
-
-
--
-- ------
----------------------------- -- ----- -----
-- --------
-------------------------------- -- ----- -----
-- ------------ ---------
-------------------------------- -- ---------可选链操作符的应用场景
可选链操作符可以避免代码中的 undefined 错误，提高代码的健壮性。以下是几个可选链操作符的应用场景。
1. 访问对象的属性
在访问对象的属性时，如果该属性不存在，就会返回 undefined。使用可选链操作符可以避免这种情况。
----- --- - -
---- -
---- -
---- ------ ------
-
-
--
-- ------
----------------------------- -- ---------- ------ ---- -------- ----- -- ---------
-- --------
-------------------------------- -- ---------2. 调用对象的方法
在调用对象的方法时，如果该方法不存在，就会抛出异常。使用可选链操作符可以避免这种情况。
----- --- - -
---- -
---- -
---- ---------- -
------------------ --------
-
-
-
--
-- ------
------------------ -- ---------- ------ ---- -------- ----- -- ---------
-- --------
----------------------- -- ---------3. 链式调用
在链式调用中，如果某个方法返回的是 null 或 undefined，就会抛出异常。使用可选链操作符可以避免这种情况。
----- --- - -
---- -
---- -
---- ---------- -
------------------ --------
------ -----
-
-
-
--
-- --------
-------------------------------- -- ---------- ------ ---- -------- ------------- -- ----
-- --------
-------------------------------------- -- ---------总结
可选链操作符是 ECMAScript 2020 中的新特性，可以避免代码中的 undefined 错误，提高代码的健壮性。在访问对象的属性、调用对象的方法和链式调用中，都可以使用可选链操作符。在实际开发中，我们应该多加运用可选链操作符，避免出现不必要的错误。
参考文献
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/660bcca2d10417a222c04ac6