JavaScript 2021(ES12)：新添加的功能

1. 新的逻辑运算符

• &&=
• ||=
• ??=

1. &&=
   在深入解释之前，先看看下面给出的示例代码：

let a = 1; 
let b = 2; 
a &&= b; 
console.log(a) // 变量 ‘a‘ 的输出为 2。

该行a&&= b类似于下面给出的代码块：

if(a) { 
  a = b; 
}

这个逻辑运算符是说，如果变量a有一个真值（因为它持有一个非零值），那么a应该为变量b分配的值。这就是为什么当我们这样做时console.log(a)，变量的值a计算为 2 而不是 1。

2. ||=
   考虑下面给出的以下代码块：

let a = 1; 
let b = 2; 
a ||= b; 
console.log(b); // 变量 ‘a‘ 的输出为 1。

该运算符与&&=运算符相反。在这种情况下，变量a将仅等于变量b并且仅当变量a具有假值时。上面的代码块相当于下面给出的代码：

if (!a) { 
  a = b; 
}

3. ??=
   此运算符检查值是null还是undefined。考虑以下示例：

let a; 
let b = 2; 
a ??= 1; 
console.log(a) // 变量 ‘a‘ 的输出为 1。
// 此代码块类似于上面给出的代码。
// if(a === null || a === undefined) { 
// a = 1 
// }

在给定的示例中，变量 ‘a‘ 的值计算为undefined因此，if条件计算为true并且 ‘a‘ 被赋值为 1。

2. 字符串 ‘replaceAll‘ 方法
   我们都使用过 stringreplace方法将字符串中的一个或多个单词替换为我们指定的元素。但它有一个限制，这种方法只替换了我们想要替换的字符或单词的第一次出现，而字符串中的其余出现次数保持不变。要替换所有字符或单词，我们必须使用正则表达式。
   例子：

// without regex
let str = ‘JS is everywhere. JS is amazing!‘;
console.log(str.replace(‘JS‘, ‘JavaScript‘)); // the output would be ‘JavaScript is everywhere. JS is amazing!‘
// with regex
let str = ‘JS is everywhere. JS is amazing!‘;
console.log(str.replace(/JS/g, ‘JavaScript‘)); // the output would be ‘JavaScript is everywhere. JavaScript is amazing!‘.

使用该replaceAll方法，消除了对正则表达式的需要。请看下面的代码:

let str = ‘JS is everywhere. JS is amazing!‘;
console.log(str.replaceAll(‘JS‘, ‘JavaScript‘)); // the output would be ‘JavaScript is everywhere. JavaScript is amazing!‘.

3. 使用下划线作为整数的分隔符
   整数是字符串、数组等中的一种数据类型。有时整数变得如此之大，以至于计算存在的元素数量或计算出该数字是一百万或十亿几乎变得困难。
   通过引入此功能，我们可以提高整数的可读性。我们可以使用下划线来分隔数字，而无需将数据类型转换为字符串。例子：

let number = 1_000_000_000; // one billion
console.log(number) // 1000000000 (the number would remain an integer)

4. ‘Promise.any()‘
   Promise详解
   Promise.any()是一个新特性，它接受几个可迭代的承诺并返回第一个履行的承诺。例子：

const p1 = new Promise(resolve => setTimeout(resolve, 500, ‘First‘));
const p2 = new Promise(resolve => setTimeout(resolve, 800, ‘Second‘));
const p3 = Promsie.reject(1);
const promises = [p1, p2, p3];
Promise.any(promises)
.then(result => {
   console.log(result);
}) // the result would be ‘First‘ because that‘s the promise, that is fulfilled first.
.catch(e => {
    console.log(e);
})

如果没有一个承诺得到履行，那么我们将得到一个AggregateError. 为了处理AggregateError，我们将在catch语句之后定义一个then语句。
then&catch的使用

5. WeakRef and Finalizers
   WeakRef是“弱引用”的缩写。WeakRef允许持有对对象的弱引用。被持有的弱引用称为“目标”。弱引用不会阻止对象被垃圾收集器回收。
   垃圾收集是一种收集不再需要的变量的方法，从而释放计算机的内存。垃圾收集地址

注意：WeakRef只应在特定情况下使用，并应尽可能避免使用。
让我们通过一个例子来理解：

const weakRefFunc = () => {
    const obj = new WeakRef({
       name: ‘JavaScript‘
    });
    console.log(obj.deref().name);
}
const test = () => {
    new Promise(resolve => {
     setTimeout(() => {
       weakRefFunc();
        resolve();
      }, 3000)
    })
    new Promise(resolve => {
     setTimeout(() => {
       weakRefFunc();
        resolve();
      }, 5000)
    })
}
test();

该deref方法返回被持有的目标，如果目标被垃圾回收，则返回undefined。
在这个例子中，变量obj是被持有的弱引用。
第一次在函数weakrefFunc内部test调用时，保证会打印“JavaScript”，但第二次调用时，不能保证会打印“JavaScript”，因为变量obj可能会被垃圾回收将其视为弱引用。

Finalizers
Finalizers主要用于搭配，WeakRef但也可以单独使用。Finalizers告诉对象何时被垃圾回收。让我们通过一个例子来理解这一点：
→ 首先，我们将使用该FinalizationRegistry方法创建Finalizers。

const registerFinalizer = new FinalizationRegistry(data => console.log(data));
const obj = {‘name‘: ‘JavaScript‘};
registerFinalizer.register(obj, ‘obj is collected now!‘)

现在，变量registerFinalizer是一个包含register我们将要使用的方法的对象。
registerFinalizer.register需要 2 个参数。第一个是垃圾回收要监视的对象，第二个是我们希望在对象被垃圾回收时向控制台显示的消息。
现在，当obj垃圾收集器收集变量时，会显示一条消息“obj is collected now!” 将打印到控制台。

原文地址：https://javascript.plainenglish.io/javascript-2021-new-features-429bc050f4e8

JavaScript 2021(ES12)：新添加的功能

原文：https://www.cnblogs.com/lhongsen/p/14846373.html