MVC/MVP/MVVM 三种设计模式 汇总

时间：2022-08-16 21:16:35

原文 ：http://blog.csdn.net/hudan2714/article/details/50990359


MVC

MVC全名是Model View Controller，是模型(model)－视图(view)－控制器(controller)的缩写，一种软件设计典范，用一种业务逻辑、数据、界面显示分离的方法组织代码，将业务逻辑聚集到一个部件里面，在改进和个性化定制界面及用户交互的同时，不需要重新编写业务逻辑。MVC被独特的发展起来用于映射传统的输入、处理和输出功能在一个逻辑的图形化用户界面的结构中。

MVC/MVP/MVVM 三种设计模式 汇总

数据关系

  • View 接受用户交互请求
  • View 将请求转交给Controller
  • Controller 操作Model进行数据更新
  • 数据更新之后，Model通知View更新数据变化
  • View 更新变化数据

方式

所有方式都是单向通信

结构实现

View ：使用 Composite模式 
View和Controller：使用 Strategy模式 
Model和 View：使用 Observer模式同步信息

使用

MVC中的View是可以直接访问Model的！从而，View里会包含Model信息，不可避免的还要包括一些业务逻辑。在MVC模型里，更关注的Model的不变，而同时有多个对Model的不同显示，及View。所以，在MVC模型里，Model不依赖于View，但是 View是依赖于Model的。不仅如此，因为有一些业务逻辑在View里实现了，导致要更改View也是比较困难的，至少那些业务逻辑是无法重用的。

MVP

mvp的全称为Model-View-Presenter，Model提供数据，View负责显示，Controller/Presenter负责逻辑的处理。MVP与MVC有着一个重大的区别：在MVP中View并不直接使用Model，它们之间的通信是通过Presenter (MVC中的Controller)来进行的，所有的交互都发生在Presenter内部，而在MVC中View会直接从Model中读取数据而不是通过 Controller。

MVC/MVP/MVVM 三种设计模式 汇总

数据关系

  • View 接收用户交互请求
  • View 将请求转交给 Presenter
  • Presenter 操作Model进行数据更新
  • Model 通知Presenter数据发生变化
  • Presenter 更新View数据

MVP的优势

  1. Model与View完全分离，修改互不影响
  2. 更高效地使用，因为所有的逻辑交互都发生在一个地方—Presenter内部
  3. 一个Preseter可用于多个View，而不需要改变Presenter的逻辑（因为View的变化总是比Model的变化频繁）。
  4. 更便于测试。把逻辑放在Presenter中，就可以脱离用户接口来测试逻辑（单元测试）

方式

各部分之间都是双向通信

结构实现

View ：使用 Composite模式 
View和Presenter：使用 Mediator模式 
Model和Presenter：使用 Command模式同步信息

MVC和MVP区别

MVP与MVC最大的一个区别就是：Model与View层之间倒底该不该通信（甚至双向通信）

MVC和MVP关系 

MVP：是MVC模式的变种。
项目开发中，UI是容易变化的，且是多样的，一样的数据会有N种显示方式；业务逻辑也是比较容易变化的。为了使得应用具有较大的弹性，我们期望将UI、逻辑（UI的逻辑和业务逻辑）和数据隔离开来，而MVP是一个很好的选择。
Presenter代替了Controller，它比Controller担当更多的任务，也更加复杂。Presenter处理事件，执行相应的逻辑，这些逻辑映射到Model操作Model。那些处理UI如何工作的代码基本上都位于Presenter。
MVC中的Model和View使用Observer模式进行沟通；MPV中的Presenter和View则使用Mediator模式进行通信；Presenter操作Model则使用Command模式来进行。基本设计和MVC相同：Model存储数据，View对Model的表现，Presenter协调两者之间的通信。在 MVP 中 View 接收到事件，然后会将它们传递到 Presenter, 如何具体处理这些事件，将由Presenter来完成。
如果要实现的UI比较复杂，而且相关的显示逻辑还跟Model有关系，就可以在View和 Presenter之间放置一个Adapter。由这个 Adapter来访问Model和View，避免两者之间的关联。而同时，因为Adapter实现了View的接口，从而可以保证与Presenter之 间接口的不变。这样就可以保证View和Presenter之间接口的简洁，又不失去UI的灵活性。

使用

MVP的实现会根据View的实现而有一些不同，一部分倾向于在View中放置简单的逻辑，在Presenter放置复杂的逻辑；另一部分倾向于在presenter中放置全部的逻辑。这两种分别被称为：Passive View和Superivising Controller。

MVVM

MVVM是Model-View-ViewModel的简写。微软的WPF带来了新的技术体验，如Silverlight、音频、视频、3D、动画……，这导致了软件UI层更加细节化、可定制化。同时，在技术层面，WPF也带来了 诸如Binding、Dependency Property、Routed Events、Command、DataTemplate、ControlTemplate等新特性。MVVM（Model-View-ViewModel）框架的由来便是MVP（Model-View-Presenter）模式与WPF结合的应用方式时发展演变过来的一种新型架构框架。它立足于原有MVP框架并且把WPF的新特性糅合进去，以应对客户日益复杂的需求变化。

MVC/MVP/MVVM 三种设计模式 汇总

数据关系

  • View 接收用户交互请求
  • View 将请求转交给ViewModel
  • ViewModel 操作Model数据更新
  • Model 更新完数据，通知ViewModel数据发生变化
  • ViewModel 更新View数据

方式

双向绑定。View/Model的变动，自动反映在 ViewModel，反之亦然。

使用

  • 可以兼容你当下使用的 MVC/MVP 框架。
  • 增加你的应用的可测试性。
  • 配合一个绑定机制效果最好。

MVVM优点

MVVM模式和MVC模式一样，主要目的是分离视图（View）和模型（Model），有几大优点: 
1. 低耦合。View可以独立于Model变化和修改，一个ViewModel可以绑定到不同的”View”上，当View变化的时候Model可以不变，当Model变化的时候View也可以不变。 
2. 可重用性。你可以把一些视图逻辑放在一个ViewModel里面，让很多view重用这段视图逻辑。 
3. 独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel），设计人员可以专注于页面设计，生成xml代码。 
4. 可测试。界面素来是比较难于测试的，而现在测试可以针对ViewModel来写。

mvc,mvp,mvvm三者演化

MVC/MVP/MVVM 三种设计模式 汇总

说明

任何的项目框架，都是为项目服务的。没有绝对的好坏之分，只有更合适的选择。在项目进展的不同阶段，做出最合适的调整，才是是更适合团队项目发展的框架。项目设计者要谨记，任何的项目设计，都是要围绕项目发展阶段，团队成员规模，和团队整体能力而定的。切莫为了设计而设计，为了框架而框架。快速，高效的配合整个团队进展项目，才是最合适的架构。才是一个程序员为成一个leader，成为一个架构师的必经之路。

转载，请说明来源：http://blog.csdn.net/hudan2714/article/details/50990359


参考文献：https://blog.nodejitsu.com/scaling-isomorphic-javascript-code/

一、MVC

MVC/MVP/MVVM 三种设计模式 汇总
MVC


由屏幕获取响应指令， View 传送指令到 Controller，Controller 完成业务逻辑后，要求Model 改变状态Model 将新的数据发送到 View，用户得到反馈

MVCViewController.m

#import "MVCViewController.h"
#import "MVCView.h"
#import "MVCModel.h"
@interface MVCViewController ()<MVCDelegate>

@end
@implementation MVCViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    MVCView *view = [[MVCView alloc]initWithFrame:[UIScreen mainScreen].bounds];
    view.delegate = self;

    MVCModel *model = [MVCModel new];

    model.name = @"name1";

    [view setViewWithModel:model];

}
#pragma mark - delegate
//代理来返回view对viewController的操控
-(void)clickChange{

NSLog(@"chang from View!");
}

二、 MVP

MVP 模式将 Controller 改换为 Presenter，同时断开View和Model之间联系，通过Presenter做桥梁来沟通。

MVC/MVP/MVVM 三种设计模式 汇总
MVP
  1. 各部分之间的通信，都是双向的。
  2. View 与 Model 不发生联系，都通过 Presenter 传递。
  3. View 非常薄，不部署任何业务逻辑，称为"被动视图"（Passive View），即没有任何主动性，而 Presenter非常厚，所有逻辑都部署在那里。
  4. Presenter 可以另一种理解为View和Model的管家

MVPViewController.m

#import "MVPViewController.h"
#import "MVPPresenter.h"
#import "MVPCell.h"
#import "MVPModel.h"

@implementation MVPViewController
- (void)viewDidLoad {
    [super viewDidLoad];
// Do any additional setup after loading the view.
self.view.backgroundColor = [UIColor whiteColor];

    MVPPresenter *present = [MVPPresenter new];
    MVPCell *view = [MVPCell new];
    MVPModel *model = [MVPModel new];

//获取数据
    model.name = @"name1";

//视图布局
    [self.view addSubview:view];

//交给presenter处理 ，避免 view和 model 之间的交互
    [present setPreModel:model];
    [present setPreView:view];
}

MVPPresenter .h /.m

#import <Foundation/Foundation.h>
#import "MVPModel.h"
#import "MVPCell.h"
@interface MVPPresenter : NSObject 
@property(nonatomic,strong)MVPCell *MVPView;
@property(nonatomic,strong)MVPModel *model;

-(void)setPreView:(MVPCell *)view;
-(void)setPreModel:(MVPModel *)model;

-(void)clickChangName;
#import "MVPPresenter.h"
@implementation MVPPresenter
- (instancetype)init
{
self = [super init];
if (self) {

    }
return self;
}

-(void)setPreModel:(MVPModel *)model{
self.model = model;
}

-(void)setPreView:(MVPCell *)view{
self.MVPView = view;
    [self.MVPView setlabel:_model.name];
}

-(void)clickChangName{

NSLog(@"name change %d",arc4random()%10);

}

三、MVVM

MVVM 模式将 Presenter 改名为 ViewModel，基本上与 MVP 模式完全一致。

唯一的区别是，它采用双向绑定（data-binding）：View <->ViewModel , ViewModel作为Model中值得的映射，是数据发生改变时，通知View中发生改变 ，以后不需要考虑View和Model 之间的交互更新，只需着手界面布局逻辑即可

MVVMViewController.m

#import "MVVMViewController.h"
#import "MVVMView.h"
#import "MVVMModel.h"
#import "MVVMViewModel.h"
@interface MVVMViewController ()

@end

@implementation MVVMViewController

- (void)viewDidLoad {
    [super viewDidLoad];
// Do any additional setup after loading the view.

    MVVMView *MView = [MVVMView new];

    MVVMModel *model = [MVVMModel new];
    model.name = @"name1";
    MVVMViewModel *viewModel = [MVVMViewModel new];

    [self.view addSubview:MView];

//* viewModel 作为枢纽 沟通view和model之间关系
    [viewModel setWithModel:model];
    [MView setWithViewMoel:viewModel];
}

关键点：

  1. 将viewModel 中nameStr与Model 中name相对应；
  2. View中label的text值将与nameStr进行绑定(KVO键值观察)
  3. 这样model的值发生改变时 ，View会自动发生改变
  4. View 和Model通过ViewModel实现动态关联

MVVMModel

#import <Foundation/Foundation.h>

@interface MVVMModel : NSObject
@property(nonatomic,copy)NSString *name;

@end

MVVMViewModel.h

#import "MVVMModel.h"
@interface MVVMViewModel : NSObject
//对应Model中name
@property(nonatomic,copy)NSString *nameStr;

@property(nonatomic,strong)MVVMModel *model;

-(void)setWithModel:(MVVMModel *)model;
-(void)clickChangeName;

MVVMView.m 利用KVO监测值变化

#import "MVVMView.h"
#import "NSObject+FBKVOController.h"
@interface MVVMView ()

@property(nonatomic,strong)MVVMViewModel *vm;
@property(nonatomic,strong)UILabel *label;
@property(nonatomic,strong)UIButton *button;

@end
@implementation MVVMView
- (instancetype)init
{
self = [super init];
if (self) {
self.backgroundColor = [UIColor whiteColor];
self.frame = [UIScreen mainScreen].bounds;

self.label = [[UILabel alloc]initWithFrame:CGRectMake(150,100 , 100, 30)];
self.label.backgroundColor = [UIColor orangeColor];
        [self addSubview:_label];

self.button = [UIButton new];
        _button.backgroundColor = [UIColor redColor];
        [_button setTitle:@"点击" forState:UIControlStateNormal];
        [_button addTarget:self action:@selector(mvvmClickChangModel) forControlEvents:UIControlEventTouchUpInside];
        _button.frame = CGRectMake(150, 200, 50, 50);
        [self addSubview:_button];
    }
return self;
}
-(void)setWithViewMoel:(MVVMViewModel *)vm{
self.vm = vm;
//KVO
    [self.vm addObserver:self forKeyPath:@"nameStr" options:NSKeyValueObservingOptionOld|NSKeyValueObservingOptionNew context:nil];
self.label.text = vm.nameStr;

// //* FBKVO 第三方库
// [self.KVOController observe:self.vm keyPath:@"nameStr" options:NSKeyValueObservingOptionInitial|NSKeyValueObservingOptionNew block:^(id _Nullable observer, id _Nonnull object, NSDictionary<NSString *,id> * _Nonnull change) {
// self.label.text = change[NSKeyValueChangeNewKey];
// }];

}
-(void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:    (NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context{
if ([keyPath isEqualToString:@"nameStr"]&&[change objectForKey:NSKeyValueChangeNewKey]) {
NSNumber *new = [change objectForKey:NSKeyValueChangeNewKey];
self.label.text = [NSString stringWithFormat:@"%@",new];
    }
}
-(void)mvvmClickChangModel{
    [self.vm clickChangeName];
}
-(void)dealloc{
    [self.vm removeObserver:self forKeyPath:@"nameStr"];
}

Example Demo

GitHub : https://github.com/one-tea/MVC-MVP-MVVM.git

顶
3

标签：

相关文章