彻底告别 &&，可选链助你精简代码

在JavaScript中，我们经常会遇到需要访问嵌套对象属性的情况。传统的方法是使用点运算符(.)或方括号([])来访问属性，但是这种方法存在一个问题：如果某个属性不存在，则会抛出一个错误。可选链运算符(?.)可以解决这个问题，它允许您安全地访问嵌套对象属性，即使该属性不存在也不会抛出错误。

可选链运算符的语法很简单，它与点运算符非常相似。唯一不同的是，可选链运算符在属性名前面加了一个问号(?)。例如：

const user = {
  name: 'John',
  address: {
    city: 'New York',
    state: 'New York',
  },
};

console.log(user.address.city); // New York
console.log(user.address.country); // undefined

在上面的示例中，我们使用可选链运算符访问了user对象的address属性，然后又访问了address对象的city属性。由于city属性存在，因此第一行代码输出"New York"。但是，country属性不存在，因此第二行代码输出undefined。

可选链运算符不仅可以用来访问嵌套对象属性，还可以用来调用方法。例如：

const user = {
  name: 'John',
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  },
};

user.greet(); // Hello, my name is John

在上面的示例中，我们使用可选链运算符调用了user对象的greet方法。由于greet方法存在，因此第一行代码输出"Hello, my name is John"。

可选链运算符是一种非常强大的工具，它可以帮助我们安全、简便地访问嵌套对象属性和调用方法。通过使用可选链运算符，我们可以精简代码，提升代码的可读性和安全性。

除了上面的用法之外，可选链运算符还有一些其他的用法。例如，我们可以使用可选链运算符来设置嵌套对象属性：

const user = {};

user.address?.city = 'New York';
user.address?.state = 'New York';

在上面的示例中，我们使用可选链运算符设置了user对象的address属性的city和state属性。由于address属性不存在，因此第一行代码和第二行代码都不会执行。

我们还可以使用可选链运算符来检查嵌套对象属性是否存在：

const user = {};

if (user.address?.city) {
  console.log('User has a city address');
} else {
  console.log('User does not have a city address');
}

在上面的示例中，我们使用可选链运算符检查了user对象的address属性的city属性是否存在。由于address属性不存在，因此第一行代码不会执行，而第二行代码会输出"User does not have a city address"。

可选链运算符是一种非常强大的工具，它可以帮助我们安全、简便地访问嵌套对象属性、调用方法、设置嵌套对象属性和检查嵌套对象属性是否存在。通过使用可选链运算符，我们可以精简代码，提升代码的可读性和安全性。