vue学习-MVVM的实现原理

什么是MVVM

• M(model)：model数据层

• V(view)：视图层

• VM(ViewModel):连接视图和数据的中间件，vue.js就是MVVM中的ViewModel层的实现者。
  
  在MVVM结构中是不允许视图和数据直接通信的只能通过View来通信，而VM就定义了一个观察者来实现。

• DOM Listeners：是监听View的数据发生改变就通知Model的数据改变。

• Data Bindings：是观察数据的变化，并通知视图对应的内容发生改变。
  ViewModel能够观察到数据的变化，并通知视图改变内容依赖的就是DOM Listeners，VM能够监听视图的变化并通知数据的变化依赖的就是 Data Bindings。

至此，Vue.js就是一个MVVM的实现者，他的核心就是DOM监听和数据绑定。

总结

VM实现原理:
VM中内置了一个观察者，这观察者观察两个方面。
1. 观察视图的变化`：当视图数据发生变化，就通知数据进行变化。
2. 观察数据的变化：当数据发生变化，就通知视图发生变化。
MVVM通过VM实现了数据视图的双向绑定。