近年来，前端技术日新月异，新功能层出不穷。而其中，ES2021（即 ECMAScript 2021）是最受瞩目的一项。与其前身 ES6 相比，ES2021 在性能和功能方面都有很大的提升。本文将详细讲解 ES2021 的重要性能提升，并通过示例代码来帮助大家学习。
1. Promise.any()
Promise.any() 是 Promise.all() 和 Promise.race() 的一种新简化形式。它的作用是：当 Promise 数组中有一个成功（resolved）时，返回该 Promise 的值，而无论其它 Promise 是否成功。如果 Promise 数组中所有 Promise 都失败（rejected），就返回一个 AggregateError 对象。
示例代码：
const promises = [fetch('url1'), fetch('url2'), fetch('url3')];
Promise.any(promises).then((value) => {
console.log(value);
}).catch((error) => {
console.error(error);
});在这个例子中，我们用 Promise.any() 来获取三个 URL 的响应内容，只要任一一个成功就返回，否则抛出错误。
2. WeakRefs
其他语言中的「弱引用」（Weak Reference）对于 JavaScript 而言一直是一个痛点。为了确保性能和内存管理，JavaScript 中的引用（Reference）是强的，这意味着只要有一个对象引用了另一个对象，后者就会常驻内存。WeakRefs 解决了这个问题，可以在不持久存储引用的情况下，即使对象还在内存中，也能够释放对它的引用。
示例代码：
let obj = { x: 10 };
const weakRef = new WeakRef(obj);
// 稍后释放对象的引用
obj = null;
console.log(weakRef.deref());在这个例子中，我们使用 WeakRef 来创建一个指向对象的弱引用。然后，我们通过将 obj 设置为 null，显式地进行垃圾回收。最后，我们使用 deref() 函数获取该弱引用指向的对象，并查看其是否已被回收。
3. Numeric Separators
在 JavaScript 中，当我们编写一些特别长的数字时，很难用肉眼看出它们的值。Numeric Separators 就是为了解决这个问题而设计的：它允许我们在数字序列中添加下划线，方便我们阅读。
示例代码：
const billion = 1_000_000_000; const trillion = 1_000_000_000_000; console.log(billion); // 1000000000 console.log(trillion); // 1000000000000
在这个例子中，我们使用 Numeric Separators 来表示十亿和一万亿。通过添加下划线来分隔数字，我们能够更轻松地读取这些数字。
4. Logical Assignment Operators
ES2021 引入了 &&=、||= 和 ??= 这三个逻辑赋值运算符。它们的作用是同时对变量进行逻辑运算和赋值操作，可以减少代码的复杂度。
示例代码：
-- -------------------- ---- ------- --- - - --- - - --- - --- -- -- -- - - ----- -------- - --------------- -- -- --- - - ----- - - -- - --- -- -- -- - - ---- - ---------------- - --------------- -- - --- - - -- - - --- - --- -- -- -- - - ------ -------- - --------------- -- -
在这个例子中，我们使用逻辑赋值运算符来对变量进行逻辑运算和赋值操作。它们可以将这些操作合并到一行代码中。
结论
ES2021 提供了许多有用的新功能，包括 Promise.any()、WeakRefs、Numeric Separators 和 Logical Assignment Operators。这些新特性都可以在代码中提高性能和可读性。如果你是一个前端开发人员，那么这些特性肯定值得学习。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66f3af9ef40ec5a964e44c66