数据代理:
定义:通过一个对象代理另一个对象中属性的操作(读写)
假设有A B两个对象,我们操作B来修改A这时候 B对象就是代理
Vue的数据双向绑定 底层其实没那么复杂 面试官也会常常问到数据双向绑定的原理
本质上Vue实例代理data对象属性的操作,也就是实例做了一层数据代理
什么是数据代理,比如有两个对象 A与B 用B对象操作A对象 这时B对象就是做了数据代理,因为B对象可以进行操作A对象。
我们一旦修改data中的属性会被实例的setter给拦截到,也就是Vue会感知到并通知页面更新,至于怎么更新的底层还用了diff算法 来找差异 打补丁
说白了就是底层用了Object.defineProperty+diff算法
总结:
Vue中的数据代理:
通过vm对象来代理data对象中属性的操作(读/写)
Vue中数据代理的好处:
更加方便的操作data中的数据
基本原理:
通过Object.defineProperty()把data对象中所有属性添加到vm身上。
为每一个添加到vm上的属性,都指定一个getter/setter
在getter/setter内部去操作(读/写)data中对应的属性