vue3用weakmap缓存原始对象与proxy代理映射，核心是防止内存泄漏：其弱引用特性确保组件卸载后对象被gc自动回收，避免普通map强引用导致的依赖残留。
Vue3 用 WeakMap 来缓存原始对象和它对应的 Proxy 代理之间的映射关系，核心目的不是“提速”，而是“不泄漏”——让响应式对象在组件卸载后能被垃圾回收器自动清理，无需手动干预。
WeakMap 存什么？为什么非它不可？
它只存一层关键映射：原始对象（target）→ 它的 Proxy 实例。比如你对 { count: 0 } 调用 reactive()，Vue 就把该对象作为 key、生成的 Proxy 作为 value 存进 WeakMap。
- 同一对象多次调用
reactive()时，WeakMap 可快速命中并复用已有代理，避免重复代理和递归陷阱 - 键只能是对象，且是弱引用——这意味着它不参与 JavaScript 的可达性判定
- 只要这个原始对象在其他地方失去所有强引用（比如组件实例被销毁、变量设为
null），GC 就会立刻回收它，连带 WeakMap 中的条目也一并消失
它怎么防止内存泄漏？对比普通 Map 就明白了
如果改用普通 Map 做缓存，问题就来了：Map 对 key 是强引用。即使组件已卸载，Map 还牢牢“抓着”那个原始对象，导致对象无法被 GC 回收，依赖它的 effect、Proxy、甚至整个组件状态都滞留在内存里。
vue-composition-api-best-practices
Vue 3 组合式 API 与
热门下载
相关下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章