ES12常用新语法

Posted 2021-11-02 还是不会呀

ES12常用新语法

• • FinalizationRegistry
  • WeakRef
  • 逻辑赋值运算符
  • Numeric Separator
  • String.replaceAll

FinalizationRegistry

当一个对象没有被引用时，GC算法会对其进行回收，那么FinalizationRegistry可以知道该对象在何时被回收掉。

let info = { name: "fzb", age: 21 };

let friend = { name: "zkl", age: 21 };

// 传入对象销毁时，进行的回调
const finalizationRegistry = new FinalizationRegistry((flag) => {
  console.log("该对象已经被销毁", flag);
});
finalizationRegistry.register(info, "info"); // 传入监听的对象，和标识
finalizationRegistry.register(friend, "friend");

info = null;
friend = null;

浏览器：

WeakRef

已经知道WeakSet和WeakMap内传入的对象是弱引用，是会被GC算法进行回收的。

那么在ES12中提供了WeakRef创建一个弱引用。

let info = { name: "fzb" };

const weakRef = new WeakRef(info);

const finalizationRegistry = new FinalizationRegistry(() => {
  console.log("对象已经被销毁");
});
finalizationRegistry.register(info);
info = null;

console.log(weakRef.deref()?.name);
setTimeout(() => {
  console.log(weakRef.deref()?.name);
}, 10000);

浏览器：

逻辑赋值运算符

// 逻辑或赋值运算符 ||=
let message = "aaa";
message ||= "bbb";
// 等价于  message = message || "bbb"
console.log(message); // "aaa"
// 同样存在message=""和message=0的问题

//逻辑与赋值运算符 &&=
let info = {
  name: "fzb",
};
info &&= info.name;
// 等价于 info = info && info.name
console.log(info); // "fzb"

// 逻辑空赋值运算符 ??=
let words = "hello";
words ??= "javascript";
// 等价于 words = words ?? "JAVASCRIPT"
console.log(words); // "hello"
// ??= 实际上就是解决了 ||= 的细节问题：值为""或0的问题

Numeric Separator

Numeric Separator(数字分隔符)——_

已经讲解过：ES6：模板字符串&函数&进制&Symbol数据结构

String.replaceAll

字符串替换，和replace的用法差不多