JavaScript内核与高级编程之：`JavaScript`的`WeakMap`和`WeakSet`：它们在缓存和内存管理中的应用。 - 智猿学院-前后端，数据库，人工智能，云计算等领域前沿技术讲座

各位观众老爷，大家好！今天咱们来聊聊 JavaScript 里两个有点“神秘”但又非常实用的家伙：WeakMap 和 WeakSet。它们在缓存和内存管理中可是能起到四两拨千斤的作用。准备好，咱们要开车了！

第一站：什么是 WeakMap 和 WeakSet？

首先，别被它们的名字吓到，WeakMap 和 WeakSet 其实就是 Map 和 Set 的“弱引用”版本。啥叫弱引用？别急，听我慢慢道来。

Map 和 Set 的老底

在咱们深入 WeakMap 和 WeakSet 之前，先来回顾一下 Map 和 Set 这两个家伙。

Map：是一种键值对的集合，类似于咱们的字典，你可以通过键来快速找到对应的值。键可以是任何数据类型，值也可以是任何数据类型。

const myMap = new Map();
const key1 = { id: 1 };
const key2 = "a string key";

myMap.set(key1, "Value associated with key1");
myMap.set(key2, "Value associated with key2");

console.log(myMap.get(key1)); // 输出: Value associated with key1
console.log(myMap.get(key2)); // 输出: Value associated with key2
console.log(myMap.size);      // 输出: 2

Set：是一种值的集合，类似于咱们的集合，里面的值都是唯一的。

const mySet = new Set();
mySet.add(1);
mySet.add(2);
mySet.add(1); // 添加重复的值，Set 会自动忽略

console.log(mySet.has(1)); // 输出: true
console.log(mySet.size);  // 输出: 2

Map 和 Set 都是强引用，这意味着只要 Map 或 Set 对象存在，它所引用的键或值就不会被垃圾回收器回收。

弱引用：救命稻草

现在，轮到 WeakMap 和 WeakSet 登场了。它们的核心特点就是“弱引用”。弱引用就像是一种“君子协定”，当某个对象只被 WeakMap 或 WeakSet 引用时，垃圾回收器可以随时回收这个对象，而不会因为 WeakMap 或 WeakSet 的存在而阻止回收。也就是说，WeakMap 和 WeakSet 不会阻止垃圾回收器回收它们所引用的对象。这就像一个“备胎”，随时准备牺牲自己，成全别人。

特性 Map/Set WeakMap/WeakSet

键/值类型任意对象

引用类型强引用弱引用

垃圾回收影响阻止回收不阻止回收

API 完整受限

特性	Map/Set	WeakMap/WeakSet
键/值类型	任意	对象
引用类型	强引用	弱引用
垃圾回收影响	阻止回收	不阻止回收
API	完整	受限

第二站：WeakMap 的妙用

WeakMap 只能使用对象作为键（key），而值（value）可以是任意类型。它的主要用途在于：

存储对象的元数据，而不影响对象的生命周期

想象一下，你有一个 DOM 元素，你想给它关联一些数据，比如它的状态、配置等等。如果你直接把这些数据添加到 DOM 元素上，可能会污染 DOM 元素，而且当 DOM 元素被移除时，这些数据也可能无法自动清理。这时候，WeakMap 就派上用场了。
```
const element = document.getElementById('myElement');
const elementData = new WeakMap();

elementData.set(element, { state: 'active', config: { color: 'red' } });

// 当 element 从 DOM 中移除时，垃圾回收器会自动回收 element 以及 elementData 中对应的键值对。
```
在这个例子中，我们使用 WeakMap 来存储 DOM 元素的元数据。当 DOM 元素被移除时，由于 WeakMap 是弱引用，垃圾回收器会自动回收 DOM 元素以及 WeakMap 中对应的键值对，避免了内存泄漏。

实现私有变量

在 JavaScript 中，没有真正的私有变量。但是，我们可以使用 WeakMap 来模拟私有变量的效果。

const _counter = new WeakMap();

class Counter {
  constructor() {
    _counter.set(this, 0); // 初始化私有变量
  }

  increment() {
    const currentCount = _counter.get(this);
    _counter.set(this, currentCount + 1);
  }

  getCount() {
    return _counter.get(this);
  }
}

const myCounter = new Counter();
myCounter.increment();
console.log(myCounter.getCount()); // 输出: 1

// 外部无法直接访问 _counter，实现了私有变量的效果。

在这个例子中，我们使用 WeakMap 来存储 Counter 对象的私有变量 _counter。外部无法直接访问 _counter，实现了私有变量的效果。只有 Counter 类的实例才能通过 _counter.get(this) 和 _counter.set(this, value) 来访问和修改私有变量。

缓存计算结果

当我们需要对某个对象进行复杂的计算，并且希望缓存计算结果时，WeakMap 也可以派上用场。

const cache = new WeakMap();

function calculateSomething(obj) {
  if (cache.has(obj)) {
    console.log('从缓存中获取结果');
    return cache.get(obj);
  }

  console.log('进行复杂计算');
  const result = obj.value * 2; // 模拟复杂计算
  cache.set(obj, result);
  return result;
}

const myObject = { value: 10 };
console.log(calculateSomething(myObject)); // 输出: 进行复杂计算 20
console.log(calculateSomething(myObject)); // 输出: 从缓存中获取结果 20

// 当 myObject 被回收时，cache 中对应的缓存也会自动被回收。

在这个例子中，我们使用 WeakMap 来缓存 calculateSomething 函数的计算结果。当下次使用相同的对象调用 calculateSomething 函数时，可以直接从缓存中获取结果，避免重复计算。当 myObject 被回收时，cache 中对应的缓存也会自动被回收，避免了内存泄漏。

第三站：WeakSet 的身影

WeakSet 只能存储对象，不能存储原始类型的值（例如数字、字符串、布尔值等）。它的主要用途在于：

跟踪对象的存在

你可以使用 WeakSet 来跟踪某个对象是否还存在。这在某些情况下非常有用，例如，你需要知道某个对象是否已经被销毁，以便执行一些清理操作。
```
const mySet = new WeakSet();
let obj = { id: 1 };

mySet.add(obj);

console.log(mySet.has(obj)); // 输出: true

obj = null; // 解除 obj 的引用

// 垃圾回收器可能会在某个时刻回收 obj
// 如果 obj 已经被回收，mySet.has(obj) 将返回 false
```
在这个例子中，我们使用 WeakSet 来跟踪 obj 对象是否存在。当 obj 对象被回收时，mySet.has(obj) 将返回 false。
标记对象

你可以使用 WeakSet 来标记某个对象，而不需要修改对象本身。这在某些情况下非常有用，例如，你需要标记某个对象是否已经被处理过。
```
const processedObjects = new WeakSet();

function processObject(obj) {
  if (processedObjects.has(obj)) {
    console.log('对象已经被处理过');
    return;
  }

  console.log('处理对象');
  // 进行对象处理的逻辑
  processedObjects.add(obj);
}

const myObject = { id: 1 };
processObject(myObject); // 输出: 处理对象
processObject(myObject); // 输出: 对象已经被处理过

// 当 myObject 被回收时，processedObjects 中对应的标记也会自动被回收。
```
在这个例子中，我们使用 WeakSet 来标记 myObject 对象是否已经被处理过。当 myObject 对象被处理过之后，我们将其添加到 processedObjects 中。当下次再次处理 myObject 对象时，我们可以通过 processedObjects.has(myObject) 来判断对象是否已经被处理过。当 myObject 被回收时，processedObjects 中对应的标记也会自动被回收，避免了内存泄漏。

第四站：WeakMap 和 WeakSet 的限制

虽然 WeakMap 和 WeakSet 在某些情况下非常有用，但它们也有一些限制：

只能使用对象作为键（WeakMap）或值（WeakSet）

这是因为 WeakMap 和 WeakSet 的核心特点是弱引用，而弱引用只能应用于对象。原始类型的值（例如数字、字符串、布尔值等）会被直接存储在栈内存中，而不是堆内存中，因此无法被弱引用。
无法遍历

WeakMap 和 WeakSet 没有提供 forEach、keys、values、entries 等方法来遍历其中的元素。这是因为 WeakMap 和 WeakSet 的目的是为了存储对象的元数据或跟踪对象的存在，而不是为了存储一组数据。如果你需要遍历一组数据，应该使用 Map 或 Set。
没有 size 属性

WeakMap 和 WeakSet 没有提供 size 属性来获取其中元素的数量。这是因为 WeakMap 和 WeakSet 的元素可能会随时被垃圾回收器回收，因此无法准确地获取元素的数量。

第五站：总结

总而言之，WeakMap 和 WeakSet 是 JavaScript 中非常有用的工具，它们可以帮助我们：

存储对象的元数据，而不影响对象的生命周期。
实现私有变量。
缓存计算结果。
跟踪对象的存在。
标记对象。

但是，在使用 WeakMap 和 WeakSet 时，也要注意它们的限制：

只能使用对象作为键（WeakMap）或值（WeakSet）。
无法遍历。
没有 size 属性。

希望今天的讲座能帮助你更好地理解 WeakMap 和 WeakSet，并在实际开发中灵活运用它们，写出更健壮、更高效的代码。咱们下回再见！

发表回复 取消回复

发表回复取消回复