ES2020 是 ECMAScript 对应 2020 年的版本。这个版本不像 ES6 (ES2015)那样包含大量新特性。但也添加了许多有趣且有用的特性。想阅读更多优质文章，请点击我的博客
本文以简单的代码示例来介绍 ES2020新特性。这样，你可以很快理解这些新功能，而不需要多么复杂的解释。
可选链操作符（Optional Chaining）
可选链 可让我们在查询具有多个层级的对象时，不再需要进行冗余的各种前置校验。
日常开发中，当需要访问嵌套在对象内部好几层的属性时，可能就会得到臭名昭著的错误Uncaught TypeError: Cannot read property...，这种错误，让整段程序运行中止。
于是，你就要修改你的代码来处理来处理属性链中每一个可能的undefined对象，比如：
let nestedProp = obj && obj.first && obj.first.second;
在访问 obj.first.second 之前，要先确认 obj 和 obj.first 的值非 null(且不是 undefined)。
有了可选链式调用 ，可以大量简化类似繁琐的前置校验操作，而且更安全：
let nestedProp = obj?.first?.second;
如果obj或obj.first是null/undefined，表达式将会短路计算直接返回undefined。
可选链操作符的支持情况：
空位合并操作符（Nullish coalescing Operator）
当我们查询某个属性时，经常会给没有该属性就设置一个默认的值，比如下面两种方式：
let c = a ? a : b // 方式1 let c = a || b // 方式2
这两种方式有个明显的弊端，它都会覆盖所有的假值，如(0, '', false)，这些值可能是在某些情况下有效的输入。
let x = { profile: { name: '浪里行舟', age: '' } } console.log(x.profile.age || 18) //18
上例中age的属性为空字符串，却被等同为假值，为了解决这个问题，ES2020诞生了个新特性--空位合并操作符，用 ?? 表示。如果表达式在??的左侧运算符求值为 undefined 或 null，就返回其右侧默认值。
let c = a ?? b; // 等价于let c = a !== undefined && a !== null ? a : b;
例如有以下代码：
const x = null; const y = x ?? 500; console.log(y); // 500 const n = 0 const m = n ?? 9000; console.log(m) // 0
空位合并操作符的支持情况：
Promise.allSettled
我们知道 Promise.all 具有并发执行异步任务的能力。但它的最大问题就是如果参数中的任何一个promise为reject的话，则整个Promise.all 调用会立即终止，并返回一个reject的新的 Promise 对象。
const promises = [ Promise.resolve(1), Promise.resolve(2), Promise.reject('error') ]; Promise.all(promises) .then(responses => console.log(responses)) .catch(e => console.log(e)) // "error"
假如有这样的场景：一个页面有三个区域，分别对应三个独立的接口数据，使用 Promise.all 来并发请求三个接口，如果其中任意一个接口出现异常，状态是reject,这会导致页面中该三个区域数据全都无法出来，这个状况我们是无法接受，Promise.allSettled的出现就可以解决这个痛点：
Promise.allSettled([ Promise.reject({ code: 500, msg: '服务异常' }), Promise.resolve({ code: 200, list: [] }), Promise.resolve({ code: 200, list: [] }) ]).then(res => { console.log(res) /* 0: {status: "rejected", reason: {…}} 1: {status: "fulfilled", value: {…}} 2: {status: "fulfilled", value: {…}} */ // 过滤掉 rejected 状态，尽可能多的保证页面区域数据渲染 RenderContent( res.filter(el => { return el.status !== 'rejected' }) ) })
Promise.allSettled跟Promise.all类似, 其参数接受一个Promise的数组, 返回一个新的Promise, 唯一的不同在于, 它不会进行短路, 也就是说当Promise全部处理完成后,我们可以拿到每个Promise的状态, 而不管是否处理成功。
Promise.allSettled的支持情况：
String.prototype.matchAll
如果一个正则表达式在字符串里面有多个匹配，现在一般使用g修饰符或y修饰符，在循环里面逐一取出。
function collectGroup1 (regExp, str) { const matches = [] while (true) { const match = regExp.exec(str) if (match === null) break matches.push(match[1]) } return matches } console.log(collectGroup1(/"([^"]*)"/g, `"foo" and "bar" and "baz"`)) // [ 'foo', 'bar', 'baz' ]
值得注意的是，如果没有修饰符 /g, .exec() 只返回第一个匹配。现在通过String.prototype.matchAll方法，可以一次性取出所有匹配。