JavaScript教程：深入理解WeakRef与FinalizationRegistry-CSDN博客

本文链接：https://blog.csdn.net/gitblog_01183/article/details/148552353

JavaScript教程：深入理解WeakRef与FinalizationRegistry

前言

在JavaScript的内存管理机制中，垃圾回收器会自动释放不再被引用的对象所占用的内存。然而，在某些特殊场景下，我们需要更精细地控制对象的生命周期。本文将深入探讨JavaScript中的两个高级特性：WeakRef（弱引用）和FinalizationRegistry（终结器注册表），它们为开发者提供了更底层的内存管理能力。

基本概念：强引用与弱引用

强引用（Strong Reference）

强引用是JavaScript中最常见的引用类型。当一个对象被变量直接引用时，垃圾回收器会认为该对象是"可达的"，从而不会回收它。

let user = { name: "John" };  // 创建强引用

只要user变量保持对对象的引用，这个对象就会一直存在于内存中。

弱引用（Weak Reference）

弱引用是一种特殊的引用，它不会阻止垃圾回收器回收其引用的对象。这意味着即使存在弱引用，如果对象没有其他强引用指向它，仍然可能被回收。

let user = { name: "John" };
let weakUser = new WeakRef(user);  // 创建弱引用

WeakRef详解

基本用法

WeakRef允许我们创建一个对象的弱引用，通过WeakRef构造函数创建：

let target = { data: "important" };
let weakRef = new WeakRef(target);

要访问弱引用指向的对象，可以使用deref()方法：

let obj = weakRef.deref();
if (obj) {
    // 对象仍然存在
} else {
    // 对象已被回收
}

使用场景

缓存系统：当缓存大量对象时，使用WeakRef可以避免内存泄漏
DOM元素跟踪：跟踪DOM元素而不阻止其被回收
大型对象管理：管理内存占用大的对象，如图像、视频等

注意事项

WeakRef的行为依赖于JavaScript引擎的垃圾回收机制
对象被回收的时机不确定，不能依赖即时回收
过度使用可能导致代码难以理解和维护

FinalizationRegistry详解

基本概念

FinalizationRegistry提供了一种方式，可以在对象被垃圾回收时执行清理操作。它由三部分组成：

注册表（Registry）：管理被跟踪对象
持有值（Held Value）：传递给清理回调的值
清理回调（Cleanup Callback）：对象被回收时执行的函数

基本用法

const registry = new FinalizationRegistry((heldValue) => {
    console.log(`${heldValue} 已被回收`);
});

let obj = { data: "important" };
registry.register(obj, "我的重要对象");

当obj被垃圾回收时，回调函数会执行并打印消息。

使用场景

资源清理：释放与对象关联的非内存资源
缓存维护：清理缓存中的无效条目
性能监控：跟踪对象生命周期用于分析

注意事项

清理回调的执行时机不确定
不能保证所有对象都会触发清理回调
避免在回调中执行耗时操作

实践案例：WeakRef缓存实现

下面是一个使用WeakRef和FinalizationRegistry实现的智能缓存系统：

class SmartCache {
    constructor(loader) {
        this.cache = new Map();
        this.registry = new FinalizationRegistry((key) => {
            const ref = this.cache.get(key);
            if (ref && !ref.deref()) {
                this.cache.delete(key);
            }
        });
        this.loader = loader;
    }

    get(key) {
        const ref = this.cache.get(key);
        if (ref) {
            const value = ref.deref();
            if (value) return value;
        }
        
        const freshValue = this.loader(key);
        this.cache.set(key, new WeakRef(freshValue));
        this.registry.register(freshValue, key);
        return freshValue;
    }
}

这个缓存系统会在值被垃圾回收后自动清理对应的缓存条目。