ES2020新特性

可选链操作符（Optional Chaining）

作用：让我们在查询具有多个层级对象时，不再需要进行冗余的各种前置校验

例子

新特性前

let nestedProp = obj && obj.first && obj.first.second;

使用新特性后

let nestedProp = obj?.first?.second;

空位合并操作符

作用：用？？表示，如果表达式在??的左侧运算符求值为undefined或null，就返回其右侧默认值
例子

let c = a ?? b;
// 等价于 let c = a !== undefined && a !== null ? a : b;

Promise.allSettled

作用：并发执行异步任务，并且多个任务之间互不干扰，与promise.all相比，promise.all有个缺点就是，只要其中有一个异步操作失败，其他异步操作就会停止，而promise.allSettled不会。
例子
promise.all

const promise = [
  Promise.resolve(1),
  Promise.resolve(2),
  Promise.resolve(3),
  Promise.reject('error'),
]
Promise.all(promise)
  .then(responses => console.log(responses))
  .catch(e => console.log(e)) // "error"

Promise.allSettled

Promise.allSettled([
  Promise.reject({ code: 500, msg: '服务异常'}),
  Promise.resolve({ code: 200, list: [] }),
  Promise.resolve({ code:200, list: []})
]).then(res => {
 /*
  0: {status: "rejected", reason: {...}}
  1: {status: "fulfilled}, value:{...}}
  2: {status: "fulfilled", value: {...}}
*/
// 过滤rejected状态，尽可能多的保证页面区域数据渲染
RenderContent(
  res.filter(el => {
    return el.status != 'rejected'
}
)
})

String.prototype.matchAll

作用：一次性取出所有符合的匹配项
例子

function collectGroup1 (regExp, str) {
  let results = []
  for (const match of str.matchAll(regExp) {
    results.push(match[1])
}
  return results;
}
console.log(collectGroup1(/"([^"]*)"/g, `"foo" and "bar" and "baz"`))
// ["foo", "bar", "baz"]

Dynamic import

作用: 返回一个解析为模块对象的promise，动态引用需要的内容

el.onclick = () => {
  import('/modules/my-module.js')
    .then(module => {
      // Do something with the module
    }
     .catch(err => {
        // load error;
    }
}

BigInt

作用：就是让js能够表示-(2^53-1)至 2^53-1范围之外的数。
用法：使用BigInt创建或者直接在数字后面加上n
例子

const Num = 111;
const aBigInt = BigInt(aNumber);
aBigInt === 111n // true

globalThis

作用：让开发者在Web Workers、node.js、浏览器中统一获取全局对象，不用像以前那样，需要self、window、global进行区分。
例子

globalThis.v = {value:true};

参考链接

https://juejin.im/post/6844904080955932679#heading-4