1:defineProperty API的局限性最大的原因就是它只能针对单个做监听
Vue2.X中的响应式实现正是基于defineProperty中的descriptor,对data中的属性做了遍历+递归,为每个属性设置了getter、setter。这也是为什么Vue只能对data中预定义过的属性做过响应的原因,在VUE中使用下标的方式直接修改属性的值或者添加一个预先不存在的对象属性事无法做到setter监听的,这是defineProperty的局限性
2:Proxy API的监听事针对一个对象的,那么对这个对象所有操作会进入监听操作,这就完全可以代理所有的属性,将会带来很大的性能提升和更优的代码。
Proxy可以理解成,在目标对象之前设置一层“拦截”,外界对该对象的访问,都必须先通过这层拦截,因此提供了一种机制,可以对外界的访问进行过滤和改写。
3:响应式是懒惰的
在Vue.js2.X中,对于一个深层属性嵌套的对象,要劫持它内部深层次的变化,就需要递归遍历这个对象,执行Object.defineProperty把每一层对象的数据都变成一个响应式的,这无疑会有很大的性能消耗。
在Vue.js 3.0中,使用Proxy API并不能监听到对象内部深层次的属性变化,因此她的处理方式是在getter中去递归响应式,这样的好处是真正访问到的内部属性才会变成响应式,简单的可以说是按需响应式,减少性能消耗