对象属性判空之可选链

可选链（Optional Chaining）是一种在访问对象的属性或调用对象的方法时，通过使用问号(?)来避免在对象不存在或为null/undefined的情况下产生错误的语法特性。

在使用可选链时，我们可以使用问号(?)来替代传统的属性访问操作符(.) 或方法调用操作符(())。

例如，考虑以下对象的嵌套结构：

const user = {
  id: 1,
  name: 'John',
  address: {
    street: '123 Main St',
    city: 'New York',
    country: 'USA'
  }
};

Copy

JavaScript

如果我们想获取user对象中的address对象的street属性，传统的访问方式是使用多个.操作符：

const street = user && user.address && user.address.street; // 防止报错
console.log(street); // 输出: 123 Main St

Copy

JavaScript

使用可选链，我们可以简化上述代码，通过在属性访问时添加问号(?)来避免嵌套对象不存在的问题：

const street = user?.address?.street;
console.log(street); // 输出: 123 Main St

Copy

JavaScript

在上述例子中，如果user或address不存在，可选链会自动返回undefined，而不会产生错误。这样可以简化代码并提高可读性。

可选链不仅适用于属性访问，还可以用于方法调用：

const result = user?.getName?.();
console.log(result); // 输出: undefined

Copy

JavaScript

在上述例子中，如果user对象存在getName方法，则会调用该方法并返回结果，否则返回undefined。

可选链在访问可能为null或undefined的对象属性或方法时非常有用，可以避免繁琐的条件判断和异常处理，提供代码的简洁性和可读性。该特性在ES2020中引入并得到了现代JavaScript引擎的广泛支持。