MVC，MVP和MVVM都属于软件架构设计模式（Architectural Pattern），它通过分离关注点来改进代码的组织方式。不同于设计模式（Design Pattern），只是为了解决一类问题而总结出的抽象方法，一种架构模式往往使用了多种设计模式。

MVC模式

MVC模式，即Model View Controller模式，是一种经典的把业务逻辑、视图和数据分离的代码组织策略。程序员遵循MVC模式将程序的业务逻辑聚集到一个单独的模块中，将页面呈现相关的代码聚集到另外一个模块中，最后将数据类的代码放在一个模块中。这样做的好处就是当数据和界面发生改变时，业务逻辑不需要被重新编写，反之亦然。MVC模式有助于将大型的应用程序分层管理，程序员只需要关心某一个部分，这样不仅有利于多人开发和维护，也利于测试的进行。

MVC模式包括了Model, View和Controller,那么他们都有什么特点呢？

• Model: 模型部分是应用程序中负责管理数据的部分。
• View: 视图部分是应用程序中负责数据显示的部分，也就是和用户交互的界面这部分的设计。
• Controller: 控制器部分涵盖了应用程序的整体业务逻辑，这部分代码一般比较短小精悍，其通过和Model模块通信控制数据的传递，通过View模块控制视图界面的展示。

MVC的核心目标是将用户界面与业务逻辑分离使得代码的可复用性，可维护性，可扩展性变得更好。当用户出发事件的时候，view层会发送指令到controller层，接着controller去通知model层更新数据，model层更新完数据以后直接显示在view层上，这就是MVC的工作原理。MVC有一个很大的缺陷，view层和model层是可以通信的，这表示两层之间存在耦合，耦合对于一个大型应用程序来说是非常致命的。为了改进MVC，MVP以及MVVM被提出了。

值得一提的是，MVC和设计模式有很大的关系。笔者目前还不是很了解设计模式相关的内容，这一部分也是摘抄的网上其他博客的内容，日后我会补上这块短板再来重写这部分。组合模式只在视图层活动，视图层的实现离不开组合模式，这一部分普通程序员其实无需太多关心，因为底层实现已经被框架写好了。观察者模式对应Model和View, 观察者模式有两部分，一个是被观察者，一个是观察者，观察者也就是监听者，也就是MVC中的View，被观察者也就是Model层，Model层发生的变化被View层侦测到后需要更新相关内容。策略模式是View和Controller之间的关系，Controller是View的一个策略，Controller对于View是可替换的。

MVP模式

MVP模式是MVC模式的改进版，其中M依然是Model负责管理数据，V是View负责展示页面，P则代表Presenter负责业务整体逻辑。MVP模式和MVC模式最明显的差别就是view层和model层不再能够相互直接通信，而是完全的解耦，另外presenter层充当了二者之间桥梁的角色，用于处理view层发出的事件传递到presenter层中，presenter层去操作model层的数据，并且将数据返回给view层展示，整个过程中view层和model层完全没有联系。注意：Presenter层和View层并没有耦合，他们之间可以通过接口来通信。

MVVM模式

MVVM指的是Model-View-ViewModel模型，它和MVP模型差不多，MVP是手动同步view和model,而MVVM则是自动实现这部分同步，presenter换成了viewmodel层，view和viewmodel是绑定的关系，也就是说当viewmodel变更model中的数据的时候，view层会相应地改变界面。MVVM中的View通过使用模板语法来声明式的将数据渲染进DOM。前端框架Vue.js就是应用MVVM的典范，在vue.js中，双向绑定技术可以使得model层的变化自动改变view层，而view层的改变也会自动改变model层的数据。