MVVM的组成
由Model、View、ViewModel三者组成:
- Model：代表数据模型，数据和业务逻辑都在Model层中定义；
- View：代表UI视图，负责数据的展示；
- ViewModel：View和Model的关系映射,数据库结构往往是不能直接跟界面控件一一对应上的，需要再定义一个数据对象专门对应view上的控件。而ViewModel的职责就是把model对象封装成可以显示和接受输入的界面数据对象。
机制原理
MVVM的核心是数据驱动即ViewModel，ViewModel是View和Model的关系映射。ViewModel类似中转站(Value Converter)，负责转换Model中的数据对象，使得数据变得更加易于管理和使用。MVVM本质就是基于操作数据来操作视图进而操作DOM，借助于MVVM无需直接操作DOM，开发者只需完成包含声明绑定的视图模板，编写ViewModel中有业务，使得View完全实现自动化。
在MVVM中View和Model是不可以直接进行通信的，它们之间存在这ViewModel这个中介充当着观察者的角色。当用户操作View，ViewModel感知到变化，然后通知Model发生相应改变，反之亦然。ViewModel向上与视图层View进行双向数据绑定，向下与Model通过接口请求进行数据交互，起到承上启下的作用。
ViewModel所封装出来的数据模型包含视图的状态和行为两部分，Model的数据模型只包含状态，这样的封装使得ViewModel可以完整地去描述View层。MVVM最标志的特性是数据绑定，MVVM的核心理念是通过声明式的数据绑定来实现View的分离，完全解耦View。
应用（Vue--响应式双向数据绑定的实现原理）
观察者-订阅者（数据劫持）
- 数据监听器
Observer将普通的JS对象传递给VUE实例的data选项，Vue将遍历此对象所有属性，并使用Object.defineProperty()方法将属性全部转换成setter和getter方法。当data中的属性被调用访问时，则会调用getter方法。当data中的属性被改变时，则会调用setter方法。
- 指令解析器
Compiler 的作用是对每个元素节点的指令进行解析，替换模板数据，并绑定对应的更新函数，初始化相应的订阅。
- 订阅者
Watcher作为连接Observer和Compiler的桥梁，能够订阅并接收每个属性变动的通知，执行指令绑定相应回调函数。
- 消息订阅器
Dep内部维护了一个数组，用来执行收集订阅者Watcher，数据变动触发notify()函数，在调用订阅者的update()方法。
