初识VUE响应式原理
💡
原文中文，约2800字，阅读约需7分钟。
📝
内容提要
Vue2的响应式原理是基于对象的defineProperty()方法，Vue3则使用Proxy代理代替，使用WeakMap而不是Map来存储副作用函数。
🎯
关键要点
- Vue的响应式系统是其核心特性，Vue2和Vue3在实现上有所不同。
- Vue2的响应式原理基于Object.defineProperty()方法，通过getter和setter实现数据的双向绑定。
- Vue2在初始化时将data对象的属性转化为getter/setter，无法监听新增的属性。
- Vue3使用Proxy代理代替Object.defineProperty，解决了Vue2的限制。
- Proxy提供了一层拦截机制，可以过滤和改写对目标对象的访问。
- Vue3的响应系统通过WeakMap存储副作用函数，确保修改属性时触发正确的副作用函数。
- WeakMap相比Map在内存管理上更高效，适合用于存储对象的引用。
➡️
