在 Vue3.0 中通过 Proxy来替换原本的 Object.defineProperty来实现数据响应式。
Proxy 是 ES6 中新增的功能,它可以用来自定义对象中的操作。
代表需要添加代理的对象,handler 用来自定义对象中的操作,比如可以用来自定义 get 函数。
通过自定义 函数的方式,在原本的逻辑 中插入了我们的函数逻辑,实现了在对对象任何属性进行读写时发出通知。
当然这是简单版的响应式实现,如果需要实现一个 Vue 中的响应式,需要在 get 中收集依赖,在 set 派发更新,之所以 Vue3.0 要使用Proxy 替换原本的 API 原因在于 Proxy 无需一层层递归为每个属性添加代理,一次即可完成以上操作,性能上更好,并且原本的实现有一些数据更新不能监听到,但是 Proxy 可以完美监听到任何方式的数据改变,唯一缺陷就是浏览器的兼容性不好。