ES12 中 8 个很棒的新 JavaScript 语言特性
JavaScript 语言规范,也被称为 ECMAScript 或 ES,每年都会根据需求进行修改,这不,ECMAScript 2022就来了。
虽然 JavaScript 最初是一种脚本语言,但 ECMAScript 规范指出,该语言“现在被用于多种环境和较大规模的编程应用场景。”因此,JavaScript 现在应该被理解为一种功能齐全的通用型编程语言。
让我们来看看 ECMAScript 2021 引入了哪些 JavaScript 新功能吧!
String.prototype.replaceAll
replaceAll()
方法接受一个字符串或正则表达式:模式pattern,这是它的第一个参数。第二个参数是模式的替换,参数名为replacement。给定这两个参数,replaceAll()
将返回一个新字符串,该字符串是源字符串处理之后的字符串,其中所有pattern
都替换为replacement
。
replaceAll()
方法的工作方式与replace()
完全相同,但作用于字符串中的所有出现的pattern,而不仅仅是第一个。
let quote = "all the world's a stage, and all the men and women merely players"; let newQuote = quote.replaceAll("all", "most of"); console.log(newQuote);
promise.any()
promise.any()
方法接受一组promise,并允许您通过返回新的promise来响应第一个成功完成的promise。
如果任何一个 Promise 出错,promise.any()
仍然会根据集合中的第一个已解决的 Promise 进行操作。
如果传入的 Promise 都没有解析,则该方法返回被拒绝的 Promise。
promise.any()——全部解决
const promise1 = new Promise((resolve, reject) => { setTimeout(resolve, 1000, "1 second"); }); const promise2 = new Promise((resolve, reject) => { setTimeout(resolve, 2000, "2 second"); }); let promises = [promise1, promise2]; Promise.any(promises).then((firstResolved) => { console.log(firstResolved); // outputs “1 second” })
promise.any()——全部被拒绝
const promise1 = new Promise((resolve, reject) => { setTimeout(reject, 1000, "1 second"); }); const promise2 = new Promise((resolve, reject) => { setTimeout(reject, 2000, "2 second"); }); let promises = [promise1, promise2]; Promise.any(promises).then((firstResolved) => { console.log(firstResolved); }).catch((err) => { console.log("error: " + err) }) // outputs error: AggregateError: All promises were rejected
AggregateError
AggregateError
是一种特殊的错误子类,它将许多错误组合成一个汇总对象。
在上面promise.any()——全部被拒绝的例子中返回了一个AggregateError
。该错误包含描述错误的消息和包含有关每个错误的详细信息的数组。
AggregateError: All promises were rejected errors: Array(2) 0: "1 second" 1: "2 second" length: 2 message: "All promises were rejected" stack: "AggregateError: All promises were rejected"
New logical assignment operators
ECMAScript 2021 推出新的逻辑运算符||
、??
和&&
。
Nullish assignment (??=)
我们可以使用 ??=
来测试变量是否为 null 或未定义。如果变量为 null 或未定义,您可以将表达式的右侧分配给变量。
let quote = "When goodness is lost there is morality."; let existingQuote = "A leader is best when people barely know he exists"; let nonExistingQuote = null; existingQuote ??= quote; nonExistingQuote ??= quote; console.log(existingQuote); // A leader is best when people barely know he exists console.log(nonExistingQuote); // When goodness is lost there is morality.
当作用于存在的变量时,例如existingQuote
,空赋值运算符什么也不做。但是,当作用在nonExistingQuote
上时,它会分配一个新值。
And assignment (&&=)
和赋值运算符 ( &&=
)用于表达式的左侧。如果左侧不为null或未定义,则分配表达式的右侧。如果它是假的,则什么也不做。
let emptyString = ""; emptyString &&= "bar"; console.log (emptyString); // “” let nonEmptyString = "foo"; nonEmptyString &&= "bar"; console.log(nonEmptyString); // “bar”
Or assignment (||=)
or赋值运算符与您刚刚看到的 and 赋值运算符作用相反。
let emptyString = ""; emptyString ||= "bar"; console.log (emptyString); // “bar” let nonEmptyString = "foo"; nonEmptyString ||= "bar"; console.log(nonEmptyString); // “foo”
WeakRef
WeakRef用于引用目标对象,而不会将其从垃圾回收器中拿出。一个常见的用例是WeakRef
为大对象实现缓存或映射,“不希望大对象仅仅因为它出现在缓存或映射中而保持活动状态。”
FinalizationRegistry
该规范提供了消耗许多文件句柄的长时间运行进程的示例。在这种情况下,使用FinalizationRegistry
可以确保没有句柄泄漏。
与 WeakRef
一样,FinalizationRegistry
更适合平台和框架开发人员的工具箱,而不是应用程序开发人员。
Numeric literal separators 数字分隔符
let distanceToSun = 91772000000; let distanceToSun = 91_772_000_000;
上面两种赋值结果一样,可以让我清楚的查看大数字。
Array.prototype.sort improvements
这更像是一个注释而不是一个功能。ECMAScript 2021 规范对Array.prototype.sort
工作原理的描述更加准确。这种变化应该会减少引擎之间实现起来的差异。
翻译来源:8 great new JavaScript language features in ES12 | InfoWorld https://www.infoworld.com/article/3658393/8-great-new-javascript-language-features-in-es12.html
原文:https://juejin.cn/post/7098572094677450765