随着 Web 应用复杂度的不断提升，JavaScript 内存泄漏问题日益突出。ES6 引入了 WeakMap 和 WeakSet 对象，解决部分内存泄漏问题。而 ES11 则新增了 WeakRef 和 FinalizationRegistry 对象，进一步解决内存泄漏问题。本文将对这两个新对象进行详细探讨，并给出示例代码。
WeakRef 对象
WeakRef 对象是一个弱引用对象，可以被当作另一个对象的引用，但不会阻止该对象被垃圾回收。当所引用的对象被回收后，WeakRef 对象会自动失效，不再可用。
WeakRef 对象一般用于解决缓存问题。在需要使用一个占用内存较大的对象时，可以使用 WeakRef 对象来缓存该对象，这样当内存不足时，系统可以自动回收该对象。
以下是使用 WeakRef 对象的示例代码：
-- -------------------- ---- -------
----- --- -
------------- -
------------ - --- --------------
-
-
----- --- - --- ------
----- ------- - ------------
--------------------------- --- ----- -- ----
--- - -----
----------------------------- -- ---------在上述代码中，我们定义了一个 Foo 类，该类的构造函数中新建一个 WeakRef 对象保存自身的引用。当我们对 foo 进行赋值操作后，该对象的引用计数为 0，被系统垃圾回收器回收，WeakRef 对象自动失效。
FinalizationRegistry 对象
FinalizationRegistry 对象是与 WeakRef 对象配合使用的，用于监视垃圾回收过程中特定对象的回收情况。当被监视的对象被回收时，FinalizationRegistry 对象会自动执行事先定义好的回调函数。
FinalizationRegistry 对象也可以用于解决缓存问题。我们可以在注册过程中记录对象的创建时间，并在回调函数中进行缓存失效的操作。以下是使用 FinalizationRegistry 对象的示例代码：
-- -------------------- ---- -------
----- -------- - --- ------------------------ -- -
---------------- ------ --- ---- ------- ------------
---
----- --- -
------------- -
----------------------- ----------- -------
-
-
----- --- - --- ------在上述代码中，我们定义了一个 FinalizationRegistry 对象，并在构造函数中对 Foo 对象进行注册，同时记录了注册时间和一个 key 字符串。当 Foo 对象被系统垃圾回收器回收时，FinalizationRegistry 对象会自动执行回调函数，并输出 key 值被回收的信息。
总结
WeakRef 对象和 FinalizationRegistry 对象是 ES11 新增的对象，用于解决 JavaScript 内存泄漏问题。与 WeakMap 和 WeakSet 不同的是，WeakRef 和 FinalizationRegistry 对象可以实现对特定对象的监视和回调，可以更加精细地控制内存的使用。在实际开发中，我们可以根据需要进行使用，避免内存泄漏问题的产生。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/649148dd48841e9894f48e26