你需要知道的JavaScript ES2021特性

本文通过实际示例了解JavaScript ES2021特性。
介绍JavaScript是一种比较流行的编程语言,尤其是在web开发中。多亏了ECMAScript版本,JavaScript每年都会发布很多有用的新特性。ECMAScript 2021推出了一些有趣而强大的功能,我们可以在JavaScript中使用这些功能。他们还没有被释放,但我们可以看一下。
在本文中,我们将发现一些在JavaScript中需要了解的有用的ES2021特性。让我们开始吧。
1.  数字分隔符数字分隔符是ES2021中引入的有用特性之一。它们通过在数字之间使用下划线_来分隔,使得在JavaScript中更容易读懂大数字。
看看下面的例子:

let myNumber = 1_000_000; console.log(myNumber); //output: 1000000 let num = 0.000_0002; console.log(num); //output: 2e-7

这使得在编辑代码时阅读大数字变得更加容易。
2. replaceAllreplaceAll()方法是我非常喜欢ES2021的特性之一。此方法允许你替换字符串中指定的所有字符,而不使用regex。
方法replaceAll()接受两个参数:我们想要替换的字符和我们想要替换它的字符。
下面的例子将帮助你更好地理解它:
let myStr = ‘Prograssing’; console.log(myStr.replaceAll(“s”, “m”)); //output: Programming

如你所见,我们使用replaceAll()将所有s字符替换为m字符。这允许你轻松地替换字符串上的内容,在这种情况下你不需要再使用regex。
3. 弱引用ES2021的另一个很酷的特性是WeakRef()。它用于保存对另一个对象的弱引用,这意味着它不会阻止垃圾收集器收集对象。当我们不想将对象永远保存在内存中时,它是非常有用的。
为了创建一个新的WeakRef,我们传递一个对象作为WeakRef()的参数,并在弱引用上调用deref()来读取引用。
看看下面的例子:
const myObject = new WeakRef({ name: ‘John’, age: 25 }); //Read the object. console.log(myObject.deref()); //output: {name: “John”, age: 25} //Access name. console.log(myObject.deref().name); //output: John

这只是一个简单的例子给你一个概念。我建议只在需要时使用弱引用。
4. Promise AnyPromise.any()接受数组作为参数。如果所有承诺都已解析,Promise.any()将返回第一个解析的承诺。如果所有承诺都被拒绝,你将得到一个错误。
下面是一个例子:
const promise1 = new Promise((resolve, reject) => { resolve(‘promise1 was resolved.’); }); const promise2 = new Promise((resolve, reject) => { resolve(‘promise2 was resolved.’); }); const promise3 = new Promise((resolve, reject) => { resolve(‘promise3 was resolved.’); }); let result = Promise.any([ promise1, promise2, promise3]); console.log(result); //output: promise1 was resolved.

如上所述,Promise.any()返回promise1,因为它是第一个被解析的promise。如果所有承诺都被拒绝,我们将得到一个AggregateError,其中包含拒绝的原因。
5.  逻辑赋值操作符ES2021引入了三个有用的逻辑赋值操作符:& & =、||=和??=。
两个值之间使用逻辑赋值操作符& & =。如果第一个值为true,则将第二个值赋给它。
下面是一个例子:
let firstNumber = 5; let secondNumber = 20; firstNumber & & = secondNumber; //output: 20 console.log(firstNumber); //output: 20 //Here is an equivalent to it: if(firstNumber){ firstNumber = secondNumber; }

逻辑赋值操作符||=也用于两个值之间。如果第一个值不为真(假),第二个值将被赋给它。
下面是一个例子:
let firstNumber = null; let secondNumber = 10; firstNumber ||= secondNumber; //output: 10 console.log(firstNumber); //output: 10 //Here is an equivalent to it: if(!firstNumber){ firstNumber = secondNumber; }

逻辑赋值操作符??=检查第一个值是null还是未定义。如果是,则将第二个值赋给它。
下面是一个例子:
//when first value is null or undefined let firstNumber = null; let secondNumber = 10; firstNumber ??= secondNumber; //output: 10 console.log(firstNumber); //output: 10 //when first value is truthy firstNumber = 9; firstNumber ??= secondNumber; //output: 9 console.log(firstNumber); //output: 9 //Here is an equivalent to it: if(firstNumber == null || firstNumber == undefined){ firstNumber = secondNumber; }

如你所见,这些操作符使得不使用条件语句就可以更容易地赋值。
最终的想法ES2021带来了有用的JavaScript特性,使开发人员的生活更加轻松。这就是为什么我们总是需要与最新的技术保持更新。
【你需要知道的JavaScript ES2021特性】感谢你阅读这篇文章。我希望它对你有用。

    推荐阅读