MVC、MVP、MVVM

MVC、MVP、MVVM这些模式是为了解决开发过程中的实际问题而提出来的，目前作为主流的几种架构模式而被广泛使用。

一.MVC：Model(模型)+View(视图)+controller(控制器)

主要是基于分层的目的，让彼此的职责分开。

View通过Controller来和Model联系，Controller是View和Model的协调者，View和Model不直接联系，基本联系都是单向的。

用户User通过控制器Controller来操作模板Model从而达到视图View的变化。

但是在某些情况下会出现一些不足：

1.模型的代码少

2.控制器的代码却是越写越多

3.由于写的代码较多,故不好进行性能测试

二、MVP（Model-View-Presenter）

MVP是从MVC模式演变而来的，MVC中的Controller换成了Presenter（呈现），目的就是为了完全切断View跟Model之间的联系，由Presenter充当桥梁，主要的程序逻辑在Presenter里实现。

控件组成的页面充当View，实体数据库操作充当Model，而View和Model之间的控件数据绑定操作则属于Presenter。控件事件的处理可以通过自定义的IView接口实现，而View和model都将对Presenter负责。

MVP模式的框架：Riot.js

三、MVVM（Model-View-ViewModel）

MVVM是把MVC里的Controller和MVP里的Presenter改成了ViewModel。

MVVM是一种设计思想。Model 层代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑；View 代表UI 组件，它负责将数据模型转化成UI 展现出来，ViewModel 是一个同步View 和 Model的对象，是业务逻辑层（一切js可视业务逻辑，比如表单按钮提交，自定义事件的注册和处理逻辑都在viewmodel里面负责监控俩边的数据）

在MVVM架构下，View 和 Model 之间并没有直接的联系，而是通过ViewModel进行交互，Model 和 ViewModel 之间的交互是双向的， 因此View 数据的变化会同步到Model中，而Model 数据的变化也会立即反应到View 上。

这种自动同步是因为ViewModel中的属性实现了Observer，当属性变更时都能触发对应的操作。

ViewModel 通过双向数据绑定把 View 层和 Model 层连接了起来，而View 和 Model 之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动操作DOM, 不需要关注数据状态的同步问题，复杂的数据状态维护完全由 MVVM 来统一管理。

MVVM模式的框架有：AngularJS+Vue.js和Knockout+Ember.js后两种知名度较低以及是早起的框架模式。

延申:

1.在MVVM中,view与viewController正式联系在一起,我们可以把他们视为一个组件

2.在MVVM架构中,view与viewController均不能直接引用model,而是通过引用viewModel来间接引用model

3.很多人会问,viewModel是一个什么样的架构呢?里面应该放些什么样的东西呢?我们可以在viewModel中放置用户输入逻辑,视图显示逻辑及发送网络请求和其他一些代码

那么作为一种新型的架构模式,在使用时应该有哪些地方值得我们注意呢?

1.view 可以引用viewModel,但反过来却是不行

2.viewModel 可以引用model,但是反过来也不行

3.如果我们违背了上述规则,那么我们将会无法正常使用MVVM

MVVM自推出以后,便得到了大多数开发人员的认可,那么MVVC这种设计模式有什么优点呢?

1.低耦合:view/viewController可以独立于Model而进行变化和修改,与此同时,一个viewModel可以绑定到不同的view/ViewController上

2.可重用性:可以把一些视图逻辑放在一个ViewModel里面,让很多view/ViewController进行重用

3.独立开发:通过MVVM,开发人员可以专注于逻辑开发在viewModel里面,而设计人员也可以专注于页面设计,并且使用ExpressionBlend可以更加容易设计页面和生成XAML(Extensible Application Markup Language)代码.

4.可测试:通常来说,要进行,界面测试比较困难,而MVVM可以对viewModel进行测试.