图解MVC、MVP和MVVM,简单对比

角色对比

模式角色作用模式角色作用模式角色作用
MVCModel保存数据MVPModel保存数据MVVMModel保存数据
-View用户界面-View用户界面-View用户界面
-Controller业务逻辑-Presenter业务逻辑-ViewModel数据绑定

从上表可知基本所有的模式,都是为了隔离数据、界面和业务逻辑,这三个部分。

交互对比

经典MVC的交互方式

图来自:界面之下:还原真实的 MVC、MVP、MVVM 模式交互流程:
用户通过操作View触发Controller来对Model进行操作,而Model通过观察者模式更新界面的显示。 可以看出来View和Controller只存在调用关系 ,Controller和Modle也只存在调用关系,到了View和Model也只存在通知变动的关系。严格按照这样设计并实施可以实现业务逻辑,数据和视图的解耦。只要一开始设计的好,可以保证业务逻辑变动时,其他View和Model模块完全都不需要修改。

经典MVP的交互方式

图来自:界面之下:还原真实的 MVC、MVP、MVVM 模式交互流程:
用户通过操作View,触发Presenter去操作Model,而Model当数据更新完之后在通知Presenter去更新视图。 MVP模式下,View是可以完全组件化的,只要实现了接口就可以使用,这样方便测试,也完全隔离了View和Model。唯一的缺点就是Presenter的膨胀,所有业务逻辑,交互逻辑全都在Presenter中会导致Presenter变得特别大。

经典MVVM的交互方式

图来自:界面之下:还原真实的 MVC、MVP、MVVM 模式交互流程:
MVVM模式比MVP就只是把更新View的操作抽离出来,与Model进行绑定,Binder来确保View和Model状态一致。 这样的设计可以把大量MVP中,View和Model的同步操作从Presenter移动到ViewModel的Binder中去,解耦部分ViewModel的操作。

作者只是简单对比了一下经典的常见模式,只是让自己方便记忆。想要深入的了解可以参考一下的文章,说的比较详细。

参考文章

  1. 阮一峰的网络日志——MVC,MVP 和 MVVM 的图示
  2. Linux公社——界面之下:还原真实的 MVC、MVP、MVVM 模式
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值