MVC、MVP、MVVM三种设计模式

一、MVC设计模式

• MVC全名是Model View Controller，是模型(model)-视图(view)-控制器(controller)的缩写，一种软件设计典范，用一种业务逻辑、数据、界面显示分离的方法组织代码，将业务逻辑聚集到一个部件里面，在改进和个性化定制界面及用户交互的同时，不需要重新编写业务逻辑。

层结构	说明
Model(模型)	应用程序中用于处理应用程序数据逻辑的部分
View(视图)	应用程序中处理数据显示的部分
Controller(控制器)	应用程序中处理用户交互的部分

• 通常控制器负责从视图读取数据，控制用户输入，并向模型发送数据。
  

二、MVP设计模式

• MVP是单词Model View Presenter的首字母的缩写，分别表示数据层、视图层、发布层，它是MVC架构的一种演变。作为一种新的模式，MVP与MVC有着一个重大的区别：在MVP中View并不直接使用Model，它们之间的通信是通过Presenter (MVC中的Controller)来进行的，所有的交互都发生在Presenter内部，而在MVC中View会直接从Model中读取数据而不是通过 Controller。
• MVP设计模式与MVC设计模式的区别
• MVP 模式将 Controller 改名为 Presenter，同时改变了通信方向。
  各部分之间的通信，都是双向的。
• View 与 Model 不发生联系，都通过 Presenter 传递。
• View 非常薄，不部署任何业务逻辑，称为"被动视图"（Passive View），即没有任何主动性，而 Presenter非常厚，所有逻辑都部署在那里。
  

三、MVVM设计模式

• MVVM（Model-View-ViewModel）是对 MVC（Model-View-Control）和 MVP（Model-View-Presenter）的进一步改进。

层结构	说明
View	视图层（UI 用户界面）
ViewModel	业务逻辑层（一切 js 可视为业务逻辑）
Model	数据层（存储数据及对数据的处理如增删改查）

• MVVM 将数据双向绑定（data-binding）作为核心思想，View 和 Model 之间没有联系，它们通过 ViewModel 这个桥梁进行交互。
• Model 和 ViewModel 之间的交互是双向的，因此 View 的变化会自动同步到 Model，而 Model 的变化也会立即反映到 View 上显示。
• 当用户操作 View，ViewModel 感知到变化，然后通知 Model 发生相应改变；反之当 Model 发生改变，ViewModel 也能感知到变化，使 View 作出相应更新。