mvvm简介

mvvm是 Model(模型) View（视图） ViewModel（视图模型） 的简称。这就是页面渲染和数据交互的全部内容。下面看图说话：

1、View也就是视图，也就是dom ；
2、Model也就是模型，简单理解成JavaScript相关数据；
3、ViewModel也就是视图模型，也就可以理解成沟通view已经model的桥梁（这不是废话么）；

何谓桥梁？
1.当用户进行dom操作时view就会告诉vm，然后vm会根据自定义的相关操作然后告诉model说下那个变量x给这么动一下。
2.当model发生改变时model就会告诉vm这个数据变了，然后vm根据自定义相关操作通知view这个dom节点需要改变。
3.vm充当的是一个观察者的角色，时刻关注着view/model的变化。

为什么要用mvvm

1、简化复杂逻辑数据交互

举个栗子：在使用原生js或者jq中数据发生变化，首先需要通过选择器找到相关dom节点，然后进行操作例如element的显隐、dom增减、类的添加等等，在mvvm中，只需要采用适当的指令，绑定相关变量即可操作，免去诸多逻辑上的烦恼。

2、实现单页页面

为毛要单页呢？以往项目中请求新的页面都要通过页面刷新，都需要全部请求新的资源。虽然资源可以通过缓存机制进行优化，但是新页面的加载js,css,html文件全都要被浏览器重新解析，造成资源的浪费，尤其是对移动端十分不友好。通过单页应用的异步请求局部刷新这一特性，解决了这一个问题。（同样要说的是，spa单页对seo的打击也是毁灭性的。）

ps:参考视频：慕课网饿了么实战；