谈谈MVC模式 及 MVP 和 MVVM 的图示

1.如何设计一个程序的结构，这是一门专门的学问，叫做"架构模式"（architectural pattern），属于编程的方法论。

MVC模式就是架构模式的一种，它对我的启发特别大。我觉得它不仅适用于开发软件，也适用于其他广泛的设计和组织工作。

下面是我对MVC模式的一些个人理解，不一定正确，主要用来整理思路。

2.MVC是三个单词的首字母缩写，它们是Model（模型）、View（视图）和Controller（控制）。

这个模式认为，程序不论简单或复杂，从结构上看，都可以分成三层。

1）最上面的一层，是直接面向最终用户的"视图层"（View）。它是提供给用户的操作界面，是程序的外壳。

2）最底下的一层，是核心的"数据层"（Model），也就是程序需要操作的数据或信息。

3）中间的一层，就是"控制层"（Controller），它负责根据用户从"视图层"输入的指令，选取"数据层"中的数据，然后对其进行相应的操作，产生最终结果。

这三层是紧密联系在一起的，但又是互相独立的，每一层内部的变化不影响其他层。每一层都对外提供接口（Interface），供上面一层调用。这样一来，软件就可以实现模块化，修改外观或者变更数据都不用修改其他层，大大方便了维护和升级。

3、我用Windows的计算器小程序为例，解释一下MVC模式，虽然它不一定使用这个模式编写。

在这个计算器程序中，外部的那些按钮和最上面的显示条，就是"视图层"，那些需要运算的数字就是"数据层"，执行加减乘除的那些内部运算步骤就是"控制层"。每一层执行不同的功能，整个程序的结构非常清楚。

如果我们扩大一点想象，就会发现，很多程序本质上都是这种模式：对外提供一组触发器（本例中是按钮），然后执行一些内部操作，最后返回结果。因此，MVC模式的应用是非常广泛的。

4、在我看来，不仅编写程序可以用MVC模式，家用电器也可以用。

以家用微波炉为例，可以将它也理解成三层结构。最简单的情况下，微波炉的操作用两个转盘实现，一个控制温度，另一个控制时间。这两个转盘就是"视图层"（view），而其内部的微波产生装置则是"数据层"（Model），这里的"数据"需要理解成"核心功能"。至于将用户通过转盘输入的信息，转换成对微波产生器的操作，则用"控制层"来实现。

如果每一层都是独立的，那么微波炉外部更换一个新潮的外壳，或者内部更换更大功率的微波产生器，完全可以在不更改其他层的情况下实现。这就是MVC模式的优势。

5、再进一步，如果将MVC模式解释成"外观"、"机制"和"功能/数据"这三层结构，那么很多人类组织也可以通过MVC模式架构。

比如一家商场，完全可以分成三部分。一部分是仓库，负责提供商品，这是"功能层"（或者"数据层"）；另一部分是零售铺面，负责销售商品，这是它的"外观层"；两者之间就是"机制层"，包括柜台和仓库之间一切互动的机制。

这样区分以后，这个商场的结构就变得非常清楚，可以针对不同的层进行优化，提高效率。

6、公司、政党、*、医院、学校等等，这些组织不管是盈利性还是非盈利性的，都可以从MVC模式的角度，进行架构，由一个个执行特定功能、可重复使用的模块组成。

我在想，如果人类社会都是模块化结构，那会是怎样的情景？

接下来看看MVC模式 及 MVP 和 MVVM 的区别！

一、MVC
MVC模式的意思是，软件可以分成三个部分。

视图（View）：用户界面。

控制器（Controller）：业务逻辑

模型（Model）：数据保存

各部分之间的通信方式如下。

View 传送指令到 Controller

Controller 完成业务逻辑后，要求 Model 改变状态

Model 将新的数据发送到 View，用户得到反馈

所有通信都是单向的。

二、互动模式
接受用户指令时，MVC 可以分成两种方式。一种是通过 View 接受指令，传递给 Controller。

另一种是直接通过controller接受指令。


三、实例：Backbone
实际项目往往采用更灵活的方式，以 Backbone.js 为例。

1. 用户可以向 View 发送指令（DOM 事件），再由 View 直接要求 Model 改变状态。
2. 用户也可以直接向 Controller 发送指令（改变 URL 触发 hashChange 事件），再由 Controller 发送给 View。
3. Controller 非常薄，只起到路由的作用，而 View 非常厚，业务逻辑都部署在 View。所以，Backbone 索性取消了 Controller，只保留一个 Router（路由器） 。

四、MVP
MVP 模式将 Controller 改名为 Presenter，同时改变了通信方向。

1. 各部分之间的通信，都是双向的。
2. View 与 Model 不发生联系，都通过 Presenter 传递。
3. View 非常薄，不部署任何业务逻辑，称为"被动视图"（Passive View），即没有任何主动性，而 Presenter非常厚，所有逻辑都部署在那里。

五、MVVM

MVVM 模式将 Presenter 改名为 ViewModel，基本上与 MVP 模式完全一致。

_____________________________________________________________________________________________________

_____________________________________________________________________________________________________

本文转载自 阮一峰 网站

转载地址一 ：MVC，MVP 和 MVVM 的图示  http://www.ruanyifeng.com/blog/2015/02/mvcmvp_mvvm.html

转载地址二：谈谈MVC模式 http://www.ruanyifeng.com/blog/2007/11/mvc.html