ES2021 新特性!(数据科学学习手札124)pandas 1.3版本主要更新内容一览动态规划_备忘录法_矩阵链乘问题最新的.NET 热重载介绍基于uni-app全端弹框组件uaPopup「兼容h5+小程序+app端|nvue」Innodb中有哪些锁?『无为则无心』Python序列 — 24、Python序列的推导式【Azure 应用服务】Azure Function App 执行PowerShell指令[Get-Azsubscription -TenantId $tenantID -De

2021 年 6 月 22 日,第 121 届 Ecma 国际(Ecma International)大会以远程会议形式召开。正式通过了ES2021标准,ECMAScript 2021 (ES12)成为事实的 ECMAScript 标准。

本文简要介绍了 JavaScript 今年新加了哪些语法,还好不是很多。

主要有5个新特性:

逻辑赋值运算符
数字分隔符
Promise.any & AggregateError
String.prototype.replaceAll
WeakRefs & FinalizationRegistry对象

逻辑赋值运算符

??= &&= 和 ||=

??= 的判断逻辑和 ?? 一致,左值为 null 或 undefined 时返回右值,否则返回左值。

不同的是 ??= 包含向左值赋值的操作。类比于于+= -= 中的等号。

// 旧 let a = null; a = a ?? 'daotin'; a = a && 'daotin'; a = a || 'daotin'; // 新 let a = null; a ??= 'daotin'; a &&= 'daotin'; a ||= 'daotin'; 数字分隔符

允许数值字面量中间包含不连续_ ,以提高可读性。

1_000_000_000 // Ah, so a billion 101_475_938.38 // And this is hundreds of millions let a = 1_1; // 11 let a = 1__1 // 错误,只允许一个下划线作为数字分隔符 let a = 1_; // 错误,分隔符不能在尾部 let a = _1; // 错误,分隔符不能在头部 Number(1_1); // 11 Number('1_1'); // NaN

注意:分隔符不能在尾部和头部,只能在数字之间,只允许一个下划线作为数字分隔符,不可连续。分隔符不影响数值的类型转换值,也无法在字符串转数值时被识别。

Promise.any & AggregateError

Promise.any 方法:any 接受 Promise 数组作为参数,返回合成的 Promise。只要给定的迭代中的一个 promise 成功,就采用第一个 promise 的值作为它的返回值,

const promises = [ fetch('/endpoint-a').then(() => 'a'), fetch('/endpoint-b').then(() => 'b'), fetch('/endpoint-c').then(() => 'c'), ]; try { const first = await Promise.any(promises); // Any of the promises was fulfilled. console.log(first); // → e.g. 'b' } catch (error) { // All of the promises were rejected. console.assert(error instanceof AggregateError); // Log the rejection values: console.log(error.errors); // → [ // <TypeError: Failed to fetch /endpoint-a>, // <TypeError: Failed to fetch /endpoint-b>, // <TypeError: Failed to fetch /endpoint-c> // ] }

此代码示例检查哪个端点响应最快,然后将其记录下来。只有当 所有 请求都失败时,我们才最终进入代码 catch 块,然后在其中处理错误。

多个 Promise 实例,包装成一个新的 Promise 实例:

名称 描述
all   只要一个 Promise 失败,立即返回失败,全成功返回成功数组  
race   ace是比赛、竞赛的意思,所以顾名思义,就是看谁快,就返回谁。只要一个 Promise 完成就返回结果(无论成功失败)  
any   只要一个 Promise 成功,立即返回成功,全失败返回 AggregateError  
allSettled   所有 Promise 完成才返回(无论成功失败),返回结果数组  
String.prototype.replaceAll

相比于String.prototype.replace,如果不使用全局正则表达式,就无法替换字符串中子字符串的所有实例。只会替换第一次匹配的字符。

'hello world'.replace('o', '_'); // hell_ world 'hello world'.replace(/o/g, '_'); // hell_ w_rld 'hello world'.replaceAll('o', '_'); // hell_ w_rld WeakRefs & FinalizationRegistry对象

一般来说,在JavaScript中,对象的引用是强引用的,这意味着只要持有对象的引用,它就不会被垃圾回收。只有当该对象没有任何的强引用时, js引擎垃圾回收器才会销毁该对象并且回收该对象所占的内存空间。

let obj = {a:1, b:2}; // 只要我们访问 obj 对象,这个对象就不会被垃圾回收

但是 WeakRefs 可以创建一个弱引用,对象的弱引用是指当该对象应该被 js引擎垃圾回收器回收时不会阻止垃圾回收器的回收行为。

Weakref 实例具有一个方法 deref,该方法返回被引用的原始对象,如果原始对象已被收集,则返回 undefined 对象。

const ref = new WeakRef({ name: 'daotin' }); let obj = ref.deref(); if (obj) { console.log(obj.name); // daotin }

注意:正确使用它们需要仔细考虑,如果可能,最好避免使用它们。

使用 FinalizationRegistry 对象可以在垃圾回收器回收对象时执行回调函数。

// 构建监听对象被垃圾回收器清除的回调 const registry = new FinalizationRegistry(heldValue => { console.log('----', heldValue); }); const obj = {}; const token = {}; // 注册监听 registry.register(obj, "obj deleted!", token); // 取消监听 registry.unregister(token); // 可能很久以后,回调执行 // ---- obj deleted!

register 参数分别为:

•需要监听的对象•执行回调函数的参数•取消监听用的标识符

参考链接:

•https://h3manth.com/ES2021
•https://juejin.cn/post/6978514117006983176

--- End ---

你好,我是前端队长Daotin,专注分享前端与认知。希望在这里,和你分享我的前端学习和工作经验,记录个人成长。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zypwwg.html