在前端开发中，我们常常需要访问对象的属性或方法。但是有时候，我们并不确定这个对象是否存在，或者该属性或方法是否存在。在这种情况下，我们需要进行一些额外的判断和处理，以避免出现错误。ES9 提供了一种新的操作符，叫做可选链操作符，可以帮助我们解决这个问题。
可选链操作符的作用
可选链操作符（Optional Chaining Operator）可以让我们在访问对象属性或方法时，不需要进行额外的判断。如果对象不存在或者属性或方法不存在，它会返回 undefined，而不会出现错误。
可选链操作符的语法
可选链操作符使用问号（?）来表示。它的语法如下：
obj?.prop obj?.[expr] obj?.method()
其中，obj 表示对象，prop 表示属性名，expr 表示属性名或者计算属性名的表达式，method 表示方法名。
可选链操作符的示例
下面是一个使用可选链操作符的示例代码：
-- -------------------- ---- -------
----- ---- - -
----- --------
-------- -
------- ---- ---- -----
----- ----------
------ -----
---- -------
-
--
----- ------- - ------------------
--------------------- -- -------
----- ----------- - -------------------
------------------------- -- ---------在这个示例中，我们定义了一个 user 对象，它包含一个 address 属性。我们使用可选链操作符来访问 address 对象的 zip 属性，这个属性存在，所以返回了正确的值。然后，我们使用可选链操作符来访问 user 对象的 phone 属性，这个属性不存在，所以返回了 undefined。
可选链操作符的兼容性
可选链操作符是 ES9 中新增的一个特性，目前不是所有的浏览器都支持它。如果你想在项目中使用可选链操作符，需要进行一些额外的处理，以确保在不支持它的浏览器中也能正常运行。
总结
可选链操作符是一个非常实用的特性，可以帮助我们简化代码，减少错误。它可以让我们在访问对象属性或方法时，不需要进行额外的判断。如果你想在项目中使用可选链操作符，需要注意它的兼容性，并进行一些额外的处理。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6505730a95b1f8cacd1eccc4