深入理解JavaScript的WeakMap与WeakSet：弱引用机制与应用陷阱
弱引用：JavaScript的隐形内存管家
在JavaScript的对象引用体系中，WeakMap（弱映射）和WeakSet（弱集合）扮演着特殊的角色。它们允许垃圾回收器（GC）在对象仅被它们引用时进行回收，这种特性为临时数据关联提供了高效解决方案，但也带来了独特的使用挑战。
强引用与弱引用的本质区别
常规的对象引用（如对象属性、数组元素）均为强引用，只要存在强引用，对象便不会被GC回收。
// 强引用示例
const strongRef = { id: 1 };
const holder = [strongRef]; // 数组持有强引用
strongRef = null; // 切断直接引用
console.log(holder[0]); // 依然能访问{id: 1}，对象未被回收
而WeakMap和WeakSet则采用弱引用机制，当对象仅被它们引用时，GC可以随时回收它。
// 弱引用示例
let weakRef = { id: 1 };
const weakHolder = new WeakSet();
weakHolder.add(weakRef); // WeakSet持有弱引用
weakRef = null; // 切断所有强引用
// GC运行后，weakHolder中的对象将被自动移除
// console.log(weakHolder.has(weakRef)); // 此时输出false（假设GC已执行）
WeakMap：键的隐形生命周期
WeakMap是键值对集合，其键只能是对象，且这些键不会妨碍GC回收。这一特性使其成为存储对象元数据的理想选择，但也带来了不可枚举的限制。
场景痛点：DOM元素元数据存储
假设需要为DOM元素附加临时状态，传统做法可能导致内存泄漏：
// 内存泄漏风险的实现
const elementMetadata = new Map();
function attachMetadata(element) {
elementMetadata.set(element, { isHighlighted: false });
// ...其他逻辑
}
// 当element从DOM移除后：
element.remove();
// 但elementMetadata仍持有强引用，导致element无法被GC回收
使用WeakMap则能优雅解决这个问题：
// 安全的实现
const elementMetadata = new WeakMap();
function attachMetadata(element) {
elementMetadata.set(element, { isHighlighted: false });
// ...其他逻辑
}
// 当element从DOM移除后：
element.remove();
// 无需手动清理，GC会自动回收element及其关联状态
不可枚举的"双刃剑"
WeakMap不提供迭代方法（如keys()、values()、entries()），也没有size属性。这是弱引用特性的必然结果——因为枚举过程中引用状态可能随时变化。开发者必须通过已知的键来访问对应的值：
const cacheStore = new WeakMap();
function getComputedValue(dataKey) {
if (!cacheStore.has(dataKey)) {
const result = performHeavyComputation(dataKey);
cacheStore.set(dataKey, result);
}
return cacheStore.get(dataKey);
}
WeakSet：独特的对象存在性追踪
WeakSet专门用于存储对象的集合，它仅关注对象是否存在，而不关心具体内容。与WeakMap类似，其元素也会被GC自动管理。
去重场景的内存优化
在需要对对象进行去重处理时，WeakSet能避免传统数组去重导致的内存堆积：
// 低效的数组去重（强引用导致内存问题）
const processedItems = [];
function processItem(item) {
if (processedItems.includes(item)) return;
processedItems.push(item);
// ...处理逻辑
}
// 优化的WeakSet实现
const processedItems = new WeakSet();
function processItem(item) {
if (processedItems.has(item)) return;
processedItems.add(item);
// ...处理逻辑
}
// 当item不再被其他地方引用时，会自动从processedItems中移除
循环引用检测
WeakSet的弱引用特性使其成为检测对象循环引用的利器：
function detectCycle(node, visited = new WeakSet()) {
if (node && typeof node === 'object') {
if (visited.has(node)) return true;
visited.add(node);
for (const key in node) {
if (detectCycle(node[key], visited)) return true;
}
// visited.delete(node); // 可选：允许对象在其他分支重用
}
return false;
}
// 测试循环引用
const nodeA = {};
const nodeB = { child: nodeA };
nodeA.parent = nodeB;
console.log(detectCycle(nodeA)); // 输出true
实战陷阱与防御策略
尽管WeakMap和WeakSet提供了优雅的内存管理方案，但如果误用仍会导致难以调试的问题。
陷阱1：错误使用基本类型作为键
WeakMap的键必须是对象，传入基本类型会抛出TypeError：
const cache = new WeakMap();
try {
cache.set('key', 'value'); // TypeError: Invalid value used as weak map key
} catch (e) {
console.error(e);
}
防御策略：使用包装对象或改用普通Map存储基本类型键值对。
陷阱2：依赖引用稳定性
由于GC会自动移除WeakMap/WeakSet中的条目，依赖其引用稳定性可能导致意外行为：
const cache = new WeakMap();
function getCachedResult(dataKey) {
cache.set(dataKey, performCalculation(dataKey));
// 危险：假设dataKey在后续代码中可能失去引用
Promise.resolve().then(() => {
// 此处无法保证cache仍包含dataKey
console.log(cache.get(dataKey)); // 可能输出undefined
});
}
防御策略：确保在使用期间维持对键对象的强引用，或使用普通Map存储需要长期保留的数据。
