ES2020 新特性(种草)

ES2020是ECMAScript标准的最新版本。此版本包含了许多新特性，使得JavaScript开发更加方便和高效。本篇攻略将介绍ES2020中的新特性。

1. 可选链操作符(?.)

通常情况下，在使用对象属性或方法之前，需要先检查该对象是否存在。比如：

if (obj && obj.prop) {
  // do something with obj.prop
}

在ES2020中，可以使用可选链操作符(?.)来简化这个过程，如下：

if (obj?.prop) {
  // do something with obj.prop
}

如果obj不存在，表达式返回undefined而不会抛出TypeError错误。

示例

const user = {
  name: 'Alice',
  address: {
    city: 'Shanghai',
    country: 'China'
  }
};

// 传统写法
if (user && user.address && user.address.city) {
  console.log(user.address.city); // 'Shanghai'
}

// 可选链写法
console.log(user?.address?.city); // 'Shanghai'

2. 空值合并操作符(??)

通常情况下，需要在使用变量之前检查它们是否已定义，并在变量未定义时提供默认值。例如：

const foo = someValue || defaultValue;

在ES2020中，可以使用空值合并操作符(??)来简化这个过程，如下：

const foo = someValue ?? defaultValue;

空值合并操作符类似于逻辑或(||)，但是只有在左侧操作数的值为null或undefined时才会返回右侧操作数的值。

示例

const user = {
  name: 'Alice',
  age: null
};

// 传统写法
const age = (user.age !== null && user.age !== undefined) ? user.age : 18;

// 空值合并写法
const age = user.age ?? 18;

console.log(age); // 18

3. Promise.allSettled()

在ES2020中，添加了Promise.allSettled()方法，可以在所有Promise状态确定后返回所有Promise对象的结果。不同于Promise.all()方法，Promise.allSettled()会等待所有Promise对象都执行完毕，即使其中有Promise对象被拒绝了，也不会影响其他Promise对象执行并返回结果。

示例

const promises = [
  Promise.resolve('Resolved!'),
  Promise.reject('Rejected!')
];

Promise.allSettled(promises)
  .then(results => console.log(results));

输出结果：

[
  { status: 'fulfilled', value: 'Resolved!' },
  { status: 'rejected', reason: 'Rejected!' }
]

总结

以上就是ES2020中的部分新特性，可选链操作符(?.)和空值合并操作符(??)可以大大减少代码中的冗余，提高开发效率。而Promise.allSettled()则能让开发者更方便地处理Promise对象的执行结果。