MVC MVVM MVP Backbone 互动模式 架构模式总结分析

一、MVC

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

• 视图（View）：用户界面。
• 控制器（Controller）：业务逻辑
• 模型（Model）：数据保存

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

1. View 传送指令到 Controller
2. Controller 完成业务逻辑后，要求 Model 改变状态
3. Model 将新的数据发送到 View，用户得到反馈

所有通信都是单向的。MVC是将Model, View和Controller分离，让彼此的职责(responsibility)能够明确的分开，这样不论是改M, V还是C，都可以确保另外两层可不用做任何修改，同时这样的分层也可以加强程式的可测试性(testability)，View和Model基本上是相关的，但它们并不会有直接的相依关系，而是由Controller去决定Model产生的资料，然后丢给View去做呈现，也就是说，Controller是Model和View之间的协调者(coordinator)，View和Model不能直接沟通，以确保责任的分离。而Controller可以只是一个系结Model和View的小类别，也可以是大到包含Workflow, Enterprise Services或是做为外部系统的Proxy Services等的逻辑系统，MVC各元件是可以分离的组件，也可以是分离的系统(当然要设计一些机制在相互沟通)。

二、互动模式

接受用户指令时，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非常厚，所有逻辑都部署在那里。

 MVP一样也是职责分明，且Model与View分离的架构，但是这个P (Presenter)和ViewModel就很类似，不过就如同Presenter (主持人)这个字所代表的意义，所有主控View呈现的工作，都是由Presenter来做，而View本身只是Presenter所要使用的舞台而已，所以View原则上会相依于Presenter，但是为了要做到关注点分离(SoC原则)，所以在View和Presenter间都会加入一个介面(ex: IView)，然后以IoC的方式将View注射到Presenter中，而Presenter就使用介面所定义的方法去操控，而View就透过介面所定义的方法去呈现介面即可。但也因为受限于介面，所以Presenter只能依介面定义的动作去回应与处理，而不能再做更多的延伸功能，除非更改View的介面。

五、MVVM

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

唯一的区别是，它采用双向绑定（data-binding）：View的变动，自动反映在 ViewModel，反之亦然。Angular 和 Ember 都采用这种模式。MVVM的架构一样是M, V分离，但中间是以VM (ViewModel)来串接，这个ViewModel比较像是View的一个代理程式，它负责直接对Model做沟通，而View可以透过一些机制(ex: Events, Two-way Databindings, ...)来和ViewModel沟通以取得资料或将资料抛给Model做存取等工作，ViewModel也可以作为和外部系统的代理程式，例如Web Service或是REST Service或是Enterprise Services等等，不过它和MVC不同的地方，就是ViewModel和View的黏合度比较高，因为View必须要透过ViewModel才可以取得Model，而ViewModel又必须要处理来自View的通知讯息，所以虽然职责一样分明，但是却不像MVC那样可以扩展到整个系统元件都能用。如果MVVM要和MVP比较的话，MVVM会比MVP更灵活一点。

由上面各个架构的讨论，我们可以得到以下的结果：

1. MVC 架构适合于大型系统，它可以分层且可以在实体层面切割为不同的机器或服务，只要彼此间具有适当的通讯协定即可。
2. MVVM 架构适合像XAML 这种与程式码无关(code ignorance) 的使用者介面设计，只要View 中下特定的指令与ViewModel 串接，就可以享有ViewModel 沟通的功能，而ViewModel 只需做一些特别的介面实作，即可平顺的和View 沟通。
3. MVP 架构适合集中由程式码决定View 动作的应用程式，而View 只需要实作特定的介面即可，不需要太复杂的工作，但Presenter 则可能会受限于View 介面的动作，而无法做更进一步对View 的控制。

 

最后我想提的是，MVC的包容度比MVVM和MVP要来的高，在MVC的V层，可以再进一步的包含MVVM或MVP的实作，而C层也可以使用MVP (V是输出的资料)来进一步切割资料的流动与输出，M层则可以类似MVVM的架构，当V (元件)有资料的异动时，VM即可自动侦测到并更新Model (资料库)。当然，要用什么样的架构去设计，端看当时的系统环境与需求来决定，而不是只想着要用同一种架构去做所有的系统。