vue 如何实现数据响应式

什么是响应式

• 当我们对data属性进行修改后，vue立刻监听到，并对视图进行更新

响应方式：

• 关键是理解 Object.defineProperty
• 将data属性代理到vm上

Object.defineProperty

• 我们通过new操作符或者是对象字面量创建的对象的属性，是数据属性，对数据属性的获取和修改，都是对该属性的value特性的控制。是无法监控的

vue正是通过Object.defineProperty方法把data的数据属性，变为了访问器属性，这个时候这些属性的读和写都是通过get和set函数完成的。任何对这些属性的读和写的操作都会触发这两个函数，所以我们就可以在这两个函数里写我们的监听逻辑了。

data属性里的数据，是如何代理到vue实例上的呢

也是通过Object.defineProperty方法，就是遍历data对象，然后把它的属性，都设置为vm实例的访问器属性。