ES2020新特性，可选链(?.)与空位合并操作符(??)，解锁编程新体验！

可选链操作符(?.)

可选链操作符(?.)允许您安全地访问嵌套对象的属性或调用嵌套对象的函数，而无需担心对象或属性是否为null或undefined。这可以大大减少代码中的if-else语句，使代码更加简洁和易于阅读。

语法 ：

object?.property

示例：

const user = {
  name: 'John Doe',
  address: {
    street: '123 Main Street',
    city: 'Anytown',
    state: 'CA',
    zip: '12345'
  }
};

// 传统方式
if (user && user.address && user.address.city) {
  console.log(user.address.city); // "Anytown"
}

// 使用可选链操作符
console.log(user?.address?.city); // "Anytown"

// 如果address或city为null或undefined，则返回undefined
console.log(user?.address?.country); // undefined

**空位合并操作符(??) **

空位合并操作符(??)允许您指定一个默认值，当某个变量或属性为null或undefined时，该默认值将被使用。这可以简化代码，减少不必要的判断和赋值操作。

语法 ：

variable ?? default_value

示例：

// 传统方式
let name = user.name || 'Guest';

// 使用空位合并操作符
let name = user?.name ?? 'Guest';

// 如果user.name为null或undefined，则name将被设置为'Guest'

比较

特性	语法	用途
可选链操作符(?.)	object?.property	安全地访问嵌套对象的属性或调用嵌套对象的函数，无需担心对象或属性是否为null或undefined。
空位合并操作符(??)	variable ?? default_value	指定一个默认值，当某个变量或属性为null或undefined时，该默认值将被使用。

结语

ES2020中的可选链(?.)和空位合并操作符(??)是强大的工具，可以帮助JavaScript开发人员编写更简洁、更易读和更可维护的代码。通过使用这些操作符，您可以减少if-else语句的使用，消除不必要的判断和赋值操作，并使代码更加健壮。如果您还没有使用过这两个操作符，我强烈建议您开始使用它们。