ES12模块总结

(了解)ES12-FinalizationRegist

• FinalizationRegistry 对象可以让你在对象被垃圾回收时请求一个回调
  • FinalizationRegistry 提供了这样的一种方法：当一个在注册表中注册的对象被回收时，请求在某个时间点上调用一个清理回调。（清理回调有时被称为 finalizer ）
  • 你可以通过调用register方法，注册任何你想要清理回调的对象，传入该对象和所含的值

let obj = {name:"小余",age:20}

//当被GC(垃圾回收)的时候就会调用这里面的回调函数
const finalRegistry = new FinalizationRegistry(()=>{
  console.log("某一个对象被回收了 ");
})

//调用register(寄存器)进行注册任何我们想要清理回调的对象
finalRegistry.register(obj)//此时不会生效
//置为空，让obj在下轮中被垃圾回收掉
obj = null
//因为DC不是马上就回收的，它会在GPU空闲的时候进行回收，所以在一定间隔之后就会进行回收处理，然后触发我们的回调

//也可以传入多个的参数来用来当register注册多了之后如何区分
let obj = {name:"小余",age:20}
let info = {name:"coderwhy",age:18}
const finalRegistry = new FinalizationRegistry((value)=>{
  console.log("某一个对象被回收了 ：",value);
})
//第二个参数当在触发时会被加入到finalRegistry的回调函数里面
finalRegistry.register(obj,"小余")//某一个对象被回收了 ： 小余
finalRegistry.register(info,"coderwhy")//某一个对象被回收了 ： coderwhy
obj = null//将引用关联去掉，让obj下一轮被垃圾回收掉
info = null

(了解)ES12-WeakRefs对对象的弱引用

ES12 - WeakRefs

• 如果我们默认将一个对象赋值给另外一个引用，那么这个引用是一个强引用：

  • 如果我们希望是一个弱引用的话，可以使用WeakRef；

  如果多个WeakRefs 有相同的目标，那么他们的 target 对象是一样的。对其中一个调用 deref 的结果将与对另一个调用 deref 的结果匹配（在同一个作业中），您不会从其中一个获取目标对象，而是从另一个获取未定义的对象

  • deref方法返回WeakRef 实例的目标对象，如果目标对象已被垃圾收集，则返回undefined 。
  • 语法：obj = ref.deref();

let info = {name:"xiaoyu",age:20}
let obj1 = new WeakRef(info)
let obj2 = new WeakRef(info)

const finalRegistry = new FinalizationRegistry((value)=>{
  console.log("回收掉咯",value);
})

finalRegistry.register(info,"info")

setTimeout(()=>{
  info = null
},2000)

// setTimeout(()=>{
//   const infoRef = obj1.deref()
//   console.log(infoRef.name,infoRef.age);
// },7000)

console.log(obj1.name);//undefined
console.log(obj1.deref().name);//xiaoyu

使用命令进行测试：const myref = obj1.deref()

• 回收掉后进行测试，显示undefined
  
• 未回收前进行测试，显示对象里的内容。证明了deref的作用
  

如果你想为什么我不直接使用：console**.log(obj1.**name);这样来输出呢？

因为输出不了真正的内容，只会返回undefined，因为弱引用内容不可达，我们接收的obj1里的内容是WeakRef变成的弱引用对象，必须要使用deref来辅助输出

你最多说console**.log(obj1.deref().**name);这样输出

(了解)ES12-逻辑赋值运算符-replaceAll

ES12 - logical assignment operators

• 逻辑赋值运算符的简化
  • 例如||逻辑赋值运算符、??逻辑赋值运算符、&&逻辑赋值运算符

//以前学过的赋值运算符,类似下面这种
const foo = "小余" 
// const counter = 100
// counter += 50

//逻辑赋值运算符(ES12新增的)
function bar(message){
  //以前判断传入有没有值，通常这么做
  message = message || "默认值"
  //上面这种方式已经简化了
  message ||= "默认值"
  //这个例子有更好的方式，那就是前面用过的案例
  message = message ?? "默认值"//前面的方式对空字符串，0，false，之类的无能为力。这种方式则可以解决
  //那这种方式也能够简化的啦
  message ??= "默认值" 
  console.log(message);
}

//多种方式自行测试
bar("")
bar(false)
bar(0)
bar("小余666")

ES12其他知识点

• Numeric Separator：写过了；(数字分割符号，就那个数字太大用_分开)
• String.replaceAll：字符串替换；

const name = "小满今天穿黑丝,小满对此很满意"
const newName = name.replace("小满","洛洛")//只会修改第一个遇到的
const newName1 = name.replaceAll("小满","康老师")//会将全部都进行修改
console.log(newName);
console.log(newName1);