Vue：数据代理

一、MVVM模型

在MVVM模型中：

• M：Model模型，指data中的数据
• V： View视图，指模板代码
• VM：ViewModel视图模型，指Vue实例

        MVVM采用双向数据绑定，view中数据变化将自动反映到viewmodel上，反之，model中数据变化也将会自动展示在页面上。把Model和View关联起来的就是ViewModel。ViewModel负责把Model的数据同步到View显示出来，还负责把View的修改同步回Model。

MVVM核心思想，是关注model的变化，让MVVM框架利用自己的机制自动更新DOM，也就是所谓的数据-视图分离，数据不会影响视图。

二、Object.defineProprty

        VUE的底层使用了Object.defineProprty，Object.defineProperty()方法会直接在一个对象上定义一个新属性。

三、数据代理

        数据代理是通过一个对象代理另外一个对象中属性的操作（读/写），如下所示：

        VUE中使用数据代理，通过vm对象来代理data对象中属性的操作（读/写），这样更加方便操作data中的数据。

VUE代理data对象属性的基本原理如下：

• 通过Object.defineProperty()将data对象中所有属性添加到vm上
• 为每一个添加到vm上的属性，都指定一个getter和setter
• 在getter和setter方法内部去操作（读/写）data中对应的属性

        如下图所示。在Vue中，其会将我们写的data传给其自身属性_data，然后将_data中的属性（也即我们写在data中的属性）通过Object.defineProprty添加到vm中，并通过get和set方法实现与data对象中相应属性的数据代理。