基于阮一峰对MVC,MVP,MVVM的图示自己的理解

阮一峰大佬对架构的解释还是很到位的

一、MVC

  • 视图(View):
  • 用户界面 控制器(Controller):业务逻辑
  • 模型(Model):数据保存

各部分之间通信方式

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

所有通信都是单向的

二、互动模式

MVC通过两种方式接收用户指令

  • 通过View接收指令,传递给Controller
    基于阮一峰对MVC,MVP,MVVM的图示自己的理解
  • 直接通过controller接受指令
    基于阮一峰对MVC,MVP,MVVM的图示自己的理解

三、实例

实际项目往往采用更灵活的方式,这里举例的是Backbone,没怎么见过,不赘述,有兴趣了解的点最下方原文

四、MVP

MVP模式将Controller改名为Presenter,同时改变了通信方向
基于阮一峰对MVC,MVP,MVVM的图示自己的理解

  1. 各部分之前通信是双向的
  2. View和Model不发生联系,都通过Presenter传递
  3. View非常薄,不部署任何业务逻辑,称为“被动视图”(Passive View),即没有任何主动性,而Presenter非常厚,所有逻辑都部署在那里

五、MVVM

MVVM模式将Presenter改名VIewModel,基本上与MVP模式完全一致
基于阮一峰对MVC,MVP,MVVM的图示自己的理解
唯一的区别是,采用双向绑定(data-binding),VIew的变动,自动反映在ViewModel,反之亦然。Angular和Ember都采用这种模式

原文