MVVM的设计模式_mvvm设计模式

MVVM全称是Model View ViewModel,其设计模式如图

Model层：Model层代表了描述业务逻辑和数据的一系列的集合。它也定义了数据修改和操作业务规则
View层：View层代表了css，js，html等，负责展示从Presenter接收到的数据。也就是把模型转化为UI
ViewModel层：ViewModel层是负责暴露方法命令，其他的属性用来操作View状态，组装Model作为View动作的结果，并且触发View自己的事件
MVVM的核心是数据驱动（ViewModel），是View和Model的映射关系，ViewModel类似中转站，负责转换Model中的数据对象，使得数据更加易于管理和应用。MVVM的本质就是基于操作数据来操作视图进而操作dom，借助MVVM无需直接操作dom，开发者只需要完成包含声明绑定的视图模板，编写ViewModel中的业务，使得View完全实现自动化。
  在MVVM中的View和Model是不可以直接通信的，他们之间利用ViewModel这个中介当观察者角色。当用户操作View时，ViewModel会感知变化，然后在通知Model发生变化；反之亦然，ViewModel向上与视图层View进行双向数据绑定，向下与Model通过接口请求进行数据交互，起到承上启下的作用。
  ViewModel所封装出来的数据模型包含视图的状态和行为两部分，Model的数据模型只包含状态，这样的封装使得ViewModel可以完整的描述View层，MVVM自UI表配置的特性是数据绑定，MVVM的核心理念是通过声明的数据绑定来实现View的分离。
 View一定意义上是React和angular的集大成者，吸取了MVVM数据管理的思想同事应用了React的Virtual DOM算法，使用双向数据绑定来满足开发的便捷，但是不同组件又使用了单向数据流来保证数据的可控性。VUE使用了很多的angular的指令语法，但是革新了Angular的脏数据检查机制，是的数据劫持的方法来触发数据检查机制，又借鉴了Reac的组件化的思想，大大增加了前端工程的结构规范化。