ES 2020 新特性

在 ES 2020 中，有一些很是实用的新特性，接下来，就跟我一块儿看看在新版本中有哪些新特性在平时的开发中能够用到。

可选链式操做符

你们日常在工做中写代码的时候，有时候会写这样的代码：

if (a && a. b && a.b.c) {
    console.log(a.b.c);
}

由于咱们不肯定 a 或 b 是否存在，那么获取 c 就会报错，这时候可选链式调用就很是有用了。

咱们可使用可选链式操做符 ?.，若是没有值，则返回 undefined 而不是直接报错，就像下面这样：

console.log(a?.b?.c || '');

## 空值合并

控制合并运算符为 ??，它的做用是当左侧操做数为 null 或者 undefined 时，则返回右侧操做数，咱们来看实际的例子：

null ?? 7 // 7

有些同窗可能就要问了，这东西和 || 有什么区别？其实 || 操做符仍是必须的，这是这二者的应用场景不同，好比下面的状况：

'' ?? 7; // ''
'' || 7; // 7

也就是说 ?? 只有当左边是 null 和 undefined 时，才会取右边的值，而 || 则是左边为假时，就会取右边的值，比较典型的就是 0 和空字符串了。

动态引入

以前咱们能够经过 webpack 来使用动态引入，如今这个特性原生就支持了。

import('a/b.js').then(b => {
    console.log(b);
});

可是对于大多数开发者来讲是没什么感知的，毕竟大多数人仍是用 webpack 来打包的。

Promise.allSettled

Promise.allSettled 返回一个包含结果和值的对象数组，不论执行每个 Promise 时是成功仍是失败，它都会所有执行完成，而后返回结果，下面就是和 Promise.all 的对比。

const p1 = Promise.resolve(1);
const p2 = Promise.reject(2);
const p3 = Promise.resolve(3);

/**
 *[{status: "fulfilled", value: 1}
 * {status: "rejected", reason: 2}
 * {status: "fulfilled", value: 3}]
 */
Promise.allSettled([p1, p2, p3]).then(result => console.log(result));

/**
 * error 2
 */
Promise.all([p1, p2, p3]).catch(error => console.log('error', error));

其余特性

下面是一些 ES 2020 中提到的其余的特性：

• 私有属性：使用 # 来标识类的私有属性，没法从外部访问
• BigInt：可使用 BigInt 来建立更大的数字
• globalThis：提供了 globalThis 来获取不一样环境下的全局 this 对象
• matchAll：这个方法返回全部和该字符串正则表达式匹配的结果
• 模块名称空间导出：以前须要先 import 进来，而后导出去，如今能够直接导出模块下的全部东西

这些特性都没有详细说明，想了解更多，请查看下方的资料。

更多资料

1. https://v8.dev/features/tags/...

很是感谢您的阅读，欢迎关注、转发、分享支持我。