matchAll
matchAll() 方法返回一个包含所有匹配正则表达式的结果的迭代器。使用 for...of 遍历或者使用操作符 ... Array.from 将其转换成数组。
const reg = /[0-3]/g;
const data = '2020';
console.log(data.matchAll(reg)); // data.matchAll 的返回值是一个迭代器
console.log([...data.matchAll(reg)]);
/*
["2", index: 0, input: "2020", groups: undefined]
["0", index: 1, input: "2020", groups: undefined]
["2", index: 2, input: "2020", groups: undefined]
["0", index: 3, input: "2020", groups: undefined]
*/
Dynamic import
标准用法的 import 导入的模块是静态的，会使所有被导入的模块，在加载时就被翻译(无法做到按需编译，降低首页加载速度)。有些场景中，你可能希望根据条件导入模块或者按需导入模块，这时你可以使用动态导入代替静态导入,返回是一个 promise 对象
提示： 请不要滥用动态导入（只有在必要情况下采用）。静态框架能更好的初始化依赖，而且更有利于静态分析工具和 tree shaking 发挥作用。
//menu.js
export default {
menu: 'menu'
}
//index.js
if(true) {
let menu = import('./menu');
console.log(menu); //Promise {<pending>
menu.then(data => console.log(data));
} else {
}
import.meta
export * as ns from 'module'
并不会真的将导入模块，因此在该模块(menu.js)中，我们是获取不到 ns 的
export * as ns from './info';
//等价于
import * as ns from './info';
export { ns };
Promise.allSettled
Promise.allSettled() 方法返回一个在所有给定的 promise 都已经 fulfilled 或 rejected 后的 promise，并带有一个对象数组，每个对象表示对应的 promise 结果
const promise1 = Promise.resolve(100);
const promise2 = new Promise((resolve, reject) => setTimeout(reject, 100, 'info'));
const promise3 = new Promise((resolve, reject) => setTimeout(resolve, 200, 'name'))
Promise.allSettled([promise1, promise2, promise3]).
then((results) => console.log(result));
/*
[
{ status: 'fulfilled', value: 100 },
{ status: 'rejected', reason: 'info' },
{ status: 'fulfilled', value: 'name' }
]
*/
BigInt
允许超出js数字最大值(9007199254740991)存在和计算;
BigInt类型的数据必须添加后缀 n;
BigInt 和 Number 是两种数据类型，不能直接进行四则运算，不过可以进行比较操作
console.log(99n == 99); //true
console.log(99n === 99); //false
console.log(99n + 1); //TypeError: Cannot mix BigInt and other types, use explicit conversionss
GlobalThis
ES2020 中引入 globalThis 作为顶层对象，在任何环境下，都可以简单的通过 globalThis 拿到顶层对象
// 原全局对象兼容性获取
var getGlobal = function () {
if (typeof self !== 'undefined') { return self; }
if (typeof window !== 'undefined') { return window; }
if (typeof global !== 'undefined') { return global; }
throw new Error('unable to locate global object');
};
Nullish coalescing Operator(??)
当左侧的操作作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数
// 原取值
var apple = null,
orange = 0,
grape = false,
banana;
console.log(apple || 10) // 10
console.log(orange || 10) // 10
console.log(grape || 10) // 10
console.log(banana || 10) // 10
// ??
var apple = null,
orange = 0,
grape = false,
banana;
console.log(apple ?? 10) // 10
console.log(orange ?? 10) // 0
console.log(grape ?? 10) // false
console.log(banana ?? 10) // 10
Optional Chaining(?.)
可选链操作符，该表达式短路返回值是 undefined
var mobile = {
huawei: {}
}
console.log(mobile.huawei) // {}
console.log(mobile.huawei.system) // undefind
console.log(mobile.huawei.system.version) // 报错
console.log(mobile.huawei.system?.version?.xxx?.xxxx) // undefined
文章来源：小耿学前端 https://juejin.cn/post/6898518180923506702
