vue3为什么用proxy替代object.defineProperty

思路：属性拦截的几种方式

defineProperty的问题

proxy的优点

回答范例：

js中做属性拦截常见的方式有三：defineProperty，getter/setters和proxies。

vue2中使用defineProperty的原因是，2013年时只能用这种方式，2015年才有proxy，由于api存在一些局限性，比如对于数组的拦截有问题，为此vue需要专门为数组响应式做一套实现。另外不能拦截那些新增，删除属性，最后defineProperty 方案在初始化时需要深度递归遍历待处理的对象才能对它进行完全拦截，明显增加了初始化的时间。

以上亮点在proxy出现之后迎刃而解，不仅可以对数据实现拦截，还能对Map,Set实现拦截；另外proxy的拦截也是懒处理行为，如果用户没有访问嵌套对象，那么也不会实施拦截，这就让初始化的速度和内存占用都改善了。

当让proxt是有兼容性问题的，IE完全不支持，如果考虑IE兼容就不合适了

知其所以然

proxy属性拦截的原理：利用get set deleteProperty这三个trap(夹子)实现拦截

function reactive(obj){

return ner proxy(obj,{

get(target,key){},

set(target,key,val){},

deleteProperty(target,key){}

})

}