JavaScript特殊集合WeakMap 的使用及场景介绍

WeakMap 是 JavaScript 中的一种特殊集合类型，主要用于存储键值对，但其特性与普通 Map 有显著区别，尤其适合特定场景。以下是其具体使用细节：

核心特性

1.键必须是对象

WeakMap 的键只能是对象（null 除外），不能是原始值（如字符串、数字、布尔值），否则会报错。

const wm = new WeakMap();
wm.set({name: 'a'}, 1); // 有效
wm.set('key', 2); // 报错：TypeError

2.弱引用键

• 对键的引用是 “弱引用”：如果外部没有其他强引用指向该键对象，垃圾回收机制会自动回收该对象，同时 WeakMap 中对应的键值对也会被移除（无需手动删除）。
• 这意味着无法遍历 WeakMap（没有 keys()、values()、entries() 方法，也没有 size 属性），因为键可能随时被回收，无法保证遍历的完整性。

常用方法

set(key, value)：添加键值对，返回 WeakMap 实例（可链式调用）。

get(key)：根据键获取对应值，若键不存在则返回 undefined。

has(key)：判断是否存在该键，返回布尔值。

delete(key)：删除指定键值对，返回布尔值（成功删除为 true）。

典型使用场景

1.存储对象的私有数据

避免直接在对象上添加属性（可能污染对象），用 WeakMap 关联对象与私有数据，且不会阻碍对象被回收。

const privateData = new WeakMap();

class MyClass {
  constructor(id) {
    // 用实例对象作为键，存储私有数据
    privateData.set(this, { id: id, secret: 'xxx' });
  }
  getSecret() {
    return privateData.get(this).secret; // 通过实例获取私有数据
  }
}

const obj = new MyClass(1);
console.log(obj.getSecret()); // 'xxx'
// 当 obj 被销毁（无强引用），privateData 中对应的键值对会自动消失

2.DOM 元素的附加数据

为 DOM 元素绑定额外数据（如状态、缓存），但不希望影响 DOM 元素的回收。

const domData = new WeakMap();
const div = document.querySelector('div');

// 存储数据
domData.set(div, { count: 0, status: 'active' });

// 使用数据
console.log(domData.get(div).count); // 0

// 当 div 被移除且无其他引用时，domData 中对应数据会自动清除

3.缓存计算结果

缓存基于对象的计算结果，当对象被回收时，缓存自动失效，节省内存。

const cache = new WeakMap();

function calculate(obj) {
  if (cache.has(obj)) {
    return cache.get(obj); // 命中缓存
  }
  const result = /* 复杂计算 */ obj.value * 2;
  cache.set(obj, result); // 缓存结果
  return result;
}

注意事项

• 无法遍历：由于键的弱引用特性，无法像 Map 一样遍历所有键值对，也无法获取长度。
• 不适合需要持久化或遍历的场景：若需遍历或依赖键的存在性，应使用普通 Map。

WeakMap 的核心价值在于 “弱引用” 带来的自动内存管理，尤其适合关联对象与临时 / 私有数据，避免内存泄漏。