Vue3源码学习4-effect中为什么使用WeakMap，Set？
文章目录
- 前言
- 1. 精细化依赖追踪
- 2. 高效的依赖收集与触发
- 3. 自动内存管理，防止内存泄漏
- 4. 支持复杂场景
前言
在 mini vue - effect 实现中
设计（WeakMap → Map → Set → effect函数）有以下几个重要原因：
1. 精细化依赖追踪
- WeakMap 的 key 是响应式对象（target），这样每个响应式对象都能单独管理自己的依赖。
- Map 的 key 是属性名（key），这样每个属性都能单独追踪依赖于它的 effect。
- Set 存储 effect 函数，保证同一个属性不会重复收集同一个 effect。
这样可以做到：
- 只有被访问的属性才会收集依赖，属性级别的精细追踪。
- 当某个属性变化时，只通知依赖它的 effect，避免无关 effect 被触发，提高性能。
2. 高效的依赖收集与触发
- 通过 targetMap 可以快速定位到某个对象的依赖表。
- 通过 depsMap 可以快速定位到某个属性的依赖集合。
- 通过 Set 可以高效去重和遍历所有依赖 effect。
3. 自动内存管理，防止内存泄漏
- 使用 WeakMap，响应式对象被销毁时，相关依赖会自动被垃圾回收，无需手动清理。
- 如果用普通 Map，响应式对象即使被销毁，依赖关系还会残留在内存中，导致内存泄漏。
4. 支持复杂场景
- 这种结构可以支持任意数量的响应式对象、任意数量的属性、任意数量的 effect，扩展性极强。
- 也是实现 computed、watch、组件依赖等复杂响应式场景的基础。
总结：
这种 WeakMap → Map → Set 的设计，是为了实现高效、精细、自动管理内存的依赖收集系统，是 Vue3 响应式系统的核心基础。