关于mvvm的个人理解

 vue的概述部分:

Vue.js 的核心是一个响应的数据绑定系统，它让数据与 DOM 保持同步非常简单。在使用 jQuery 手工操作 DOM 时，我们的代码常常是命令式的、重复的与易错的。Vue.js 拥抱数据驱动的视图概念。通俗地讲，它意味着我们在普通 HTML 模板中使用特殊的语法将 DOM “绑定”到底层数据。一旦创建了绑定，DOM 将与数据保持同步。每当修改了数据，DOM 便相应地更新。这样我们应用中的逻辑就几乎都是直接修改数据了，不必与 DOM 更新搅在一起。这让我们的代码更容易撰写、理解与维护。

示例下的描述: 

注意我们不需要撰写任何 DOM 操作代码：被绑定增强的 HTML 模板是底层数据状态的声明式的映射，数据不过是普通 JavaScript 对象。我们的视图完全由数据驱动。

 

综合这部分描述，我的理解如下:

MVVM的职能拆分

V层：视图层，vue文件的template代码；

　　   职能是根据数据模型展示UI和事件监听（通知vm层更新数据）

　　   原话：模板中使用特殊的语法将 DOM “绑定”到底层数据（事件监听处理，触发事件后可以类似jQuery 操作 DOM）。

　　　　　　被绑定增强的 HTML 模板是底层数据状态的声明式的映射，数据不过是普通 JavaScript 对象；

M层：数据模型层，对应vue中的data数据；

　　   职能是提供视图层的数据信息；

VM层：逻辑处理层（进化后的controler），对应vue中的methods等等；

　　　  职能是处理视图层和数据模型层的连接关系，起到视图层和数据保持同步；

　　　  V => M过程：事件监听（即DOM Listeners）；视图层触发事件，vm处理逻辑更新数据；

             M => V过程：数据映射（即Data Bindings）；可以大量省略我们手动更新视图层的代码和时间；