MVC/MVP/MVVM 前端框架模式

时间:2022-08-16 21:15:53
MVC、MVP亦或者是MVVM都是一种代码组织方式,通过这种代码组织方式能够让代码更有层次感,各个层次主要负责各自的工作,这样降低了整个项目的代码逻辑耦合度与可读性

MVC开发模式:MVC,即Model层,View层,Control层,在JAVAEE中MVC是一种经典的开发模型

MVC全名是Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范。

简单来讲就是:

视图(View):用户界面

控制器(Controller):业务逻辑

模型(Model):数据保存

MVC/MVP/MVVM 前端框架模式

用户操作界面,View接受指令,View 传送指令到 Controller,也就是从View层到Control层的箭头所示

Controller 完成业务逻辑后,要求 Model 改变状态,也就是从Control层到Model层的箭头所示

Model 将新的数据发送到 View,用户得到反馈,也就是从Model层到View层的箭头所示

Android中MVC模式的体现:

其实Android开发的主要流程都是MVC模式的,比如我们常见的Activity+Layout+Model展示业务逻辑的模式,其中:

Activity - 对应着Controller层,主要是控制层,用于实现业务逻辑

Layout - 对应着View层,主要用于展示页面

Model - 对应着Model层,主要是保存数据

MVC模式的优势:

使用MVC模式降低了程序中的耦合度,使应用程序视图层与Model层分离,减少了代码之间的相互影响;

由于使用MVC模式降低代码耦合度,因此可以很方便的扩展现有程序;

不同代码模块职责划分明确,有利于代码的维护与升级;


MVP开发模式:

MVP开发模式是MVC模式一种进阶,MVP和MVC模型的主要区别是model层与View层不再发生关系而是通过Presenter层作为中间的枢纽。并且各个部分之间都是双向关联的;

简单来讲就是:

视图(View):用户界面

控制层(Presenter):业务逻辑(负责与View层和Model层双向交互)

模型(Model):数据保存

       MVC/MVP/MVVM 前端框架模式

用户操作界面,View接收指令,View传送指令到Presenter层,也就是从View层到Presenter层的箭头所示

Presenter完成业务逻辑后,要求Model改变状态,也就是从Presenter层到Model层的箭头所示

Model状态改变之后将结果返回给Presenter层,然后Presenter层在将结果反馈到View层,也就是从Model层到Presenter层,从Presenter层到View层的箭头所示

在MVP里,Presenter完全把Model和View进行了分离,主要的程序逻辑在Presenter里实现。而且,Presenter与具体的View是没有直接关联的,而是通过定义好的接口进行交互,从而使得在变更View时候可以保持Presenter的不变。

MVP模式的优势:

MPV开发模式与MVC开发模式有的优势相似,都是降低了代码的耦合度

使用MVP模式View层与Model层不在相互关联,可以更高效地使用模型,因为所有的交互都发生在一个地方——Presenter内部。


MVVM开发模式:(vuejs就是使用该种开发模式)

MVVM与MVP是相类似的,唯一的区别是,它采用双向绑定(data-binding):View的变动,自动反映在 ViewModel,反之亦然(自动更新view层显示)。

简单来讲就是:

视图(View):用户界面

控制层(VM):业务逻辑(负责与View层和Model层双向交互)

模型(Model):数据保存

用户操作界面,View接收指令,View传送指令到ViewModel

ViewModel完成业务,改变Model层数据

Model状态改变之后将结果返回该ViewModel层,然后ViewModel层自动更新View层显示

MVC/MVP/MVVM 前端框架模式