Vue响应式数据原理,Proxy 与 Object.defineProperty 优劣对比

Vue响应式数据原理,Proxy 与 Object.defineProperty 优劣对比

vue响应式数据原理

这里的响应式不是@media 媒体查询中的响应式布局，而是指vue.js会自动对页面中某些数据的变化做出响应。
这也就是vue.js最大的优点，通过MVVM思想实现数据的双向绑定，让开发者不用再操作dom对象，有更多的时间去思考业务逻辑。

Proxy 与 Object.defineProperty 优劣对比

• proxy 的优势：

1.Proxy可以直接监听对象而非属性 。
2.Proxy可以直接监听数组的变化 。
3.Proxy有多达13种拦截⽅法,不限于apply、ownKeys、deleteProperty、has等等是 Object.defineProperty 不具备的 。
4.Proxy返回的是一个新对象,我们可以只操作新的对象达到目的,而 Object.defineProperty 只能遍历对象属性直接修改。
5.Proxy作为新标准将受到浏览器厂商重点持续的性能优化，也就是传说中的新标准的性能红利 。

• Object.defineProperty 优势：

兼容性好，并且支持IE9

————————————
“ 每一扇窗，都在等候 ”