ES10: 新特性 —— 可选链操作符

介绍

在 JavaScript 中，我们经常需要访问对象的属性或方法。如果对象中不存在该属性或方法，我们通常需要使用条件语句来判断，以避免出现错误。

ES10 新增了可选链操作符（Optional Chaining Operator），可以简化这个过程，让代码更加简洁和易读。

语法

可选链操作符使用问号（?）来表示。它可以在对象属性或方法后面加上问号，表示如果该属性或方法不存在，不会抛出错误，而是返回 undefined。

object?.property
object?.method()

示例

假设我们有一个对象 person，它包含了一个属性 name 和一个方法 getAge，但是这个方法返回的对象中可能不存在 age 属性。

如果我们要获取 person 的年龄，传统的写法可能是这样的：

let age;

if (person && person.getAge && person.getAge()) {
  age = person.getAge().age;
}

使用可选链操作符，可以简化为：

const age = person?.getAge()?.age;

如果 person 或 getAge 不存在，它会返回 undefined，不会抛出错误。

指导意义

可选链操作符可以让代码更加简洁和易读，减少了冗余的条件语句。

同时，它也可以提高代码的健壮性，避免因为属性或方法不存在而导致的错误。

但是需要注意的是，在使用可选链操作符的时候，需要注意对象是否存在。如果对象不存在，它会返回 undefined，而不是抛出错误。

结论

可选链操作符是 ES10 中的一个重要新特性，可以让代码更加简洁、易读和健壮。在实际开发中，可以结合条件语句和可选链操作符来使用，让代码更加清晰和易于维护。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/675ac60e4b9d41201abb8a50