在前端开发中，我们经常需要访问对象的属性或方法。但是，当对象的属性或方法不存在时，我们可能会遇到 undefined 的问题。这种情况下，如果我们没有进行判断，就有可能出现程序崩溃的情况。为了避免这种情况的发生，ECMAScript 2020 引入了可选链操作符，可以帮助我们避免 undefined 误判。
什么是可选链操作符
可选链操作符是 ECMAScript 2020 新增的一种语法，用于访问对象的属性或方法时，可以避免出现 undefined 的情况。在使用可选链操作符时，如果对象的属性或方法不存在，它会返回 undefined 而不会抛出异常。
可选链操作符的语法如下：
--------- -- -- -------- -- ----------- -- -- --------- -- ------------ -- -- ---------- --
其中，问号（?）表示可选链操作符。
如何使用可选链操作符
下面我们通过示例代码来介绍如何使用可选链操作符。
访问对象属性
假设我们有一个对象 person，它有一个属性 name。我们想要访问 person.name 属性，但是我们不确定 person 是否存在。这时，我们可以使用可选链操作符来避免 undefined 误判。
----- ------ - - ---- -- -- -- --------- ----- ---- - ------------ -- -------------- - ---------------- -- -------- ----- ---- - ------------- -- --------- --- ---------
访问对象方法
假设我们有一个对象 calculator，它有一个方法 add。我们想要调用 calculator.add(1, 2) 方法，但是我们不确定 calculator 是否存在。这时，我们可以使用可选链操作符来避免 undefined 误判。
----- ---------- - - --------- --- -- -- - - - -- -- --------- ----- ------ - ----------------- --- -- ----------------- - ---------------- -- -------- ----- ------ - ------------------ --- -- ----------- --- ---------
访问数组元素
假设我们有一个数组 list，它有一个元素 0。我们想要访问 list[0] 元素，但是我们不确定 list 是否存在。这时，我们可以使用可选链操作符来避免 undefined 误判。
----- ---- - --- -- --- -- --------- ----- ---- - -------- -- ------- - ---------------- -- -------- ----- ---- - ---------- -- --------- --- -
总结
可选链操作符是 ECMAScript 2020 新增的一种语法，用于避免 undefined 误判。在访问对象的属性、方法或数组的元素时，我们可以使用可选链操作符来避免出现 undefined 的情况。这样可以提高程序的健壮性和可维护性。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6570f2bbd2f5e1655d99bb1c