iOS架构从 MVC、MVP 到 MVVM_苹果IOS

概述

做了这么多年的客户端研发一直在使用苹果爸爸推荐的mvc架构模式。mvc从应用层面进行分层开发，极大优化了我们的代码结构，简单易上手，很容易被程序员所接受。程序员刚接手一个新项目，如果是mvc的架构模式，会减少代码熟悉时间，快速的进行开发和维护工作，实际上对于多人开发维护的项目，mvc仍然是非常好的架构模式，这也是这种架构模式经久不衰的原因。
但是任何事物都有两面性，随着项目需求的增加，业务逻辑、网络请求、代理方法等都往controller层加塞，导致controller层变得越来越臃肿，动辄上千行的代码量绝对是维护人员的噩梦，因此在mvc基础上逐渐衍生出来了mvp、mvvm等架构模式。
本文是基于oc代码进行阐述的，使用ios开发经典的 tableview 列表来分析每个架构模式。相信看了这篇文章你会有所领悟。当然一千个人眼中有一千种哈姆雷特，具体在业务开发中使用哪种模式需要你自己去衡量。

1.传统的mvc设计模式

mvc
m: model 数据层，负责网络数据的处理，数据持久化存储和读取等工作
v: view 视图层，负责呈现从数据层传递的数据渲染工作，以及与用户的交互工作
c: controller控制器，负责连接model层跟view层，响应view的事件和作为view的代理，以及界面跳转和生命周期的处理等任务

用户的交互逻辑

用户点击 view(视图) --> 视图响应事件 -->通过代理传递事件到controller–>发起网络请求更新model—>model处理完数据–>代理或通知给controller–>改变视图样式–>完成

可以看到controller强引用view与model，而view与model是分离的，所以就可以保证model和view的可测试性和复用性，但是controller不行，因为controller是model和view的中介，所以不能复用，或者说很难复用。

ios开发实际使用的mvc架构

在实际mvc在我们实际开发中使用的mvc模式可以看到，view与controller耦合在一起了。这是由于每一个界面的创建都需要一个controller，而每一个controller里面必然会带一个view，这就导致了c和v的耦合。这种结构确实可以提高开发效率，但是一旦界面复杂就会造成controller变得非常臃肿和难以维护。

mvc代码示例
我们要实现一个简单的列表页面，每行cell都一个按钮，点击按钮前面数字➕1操作。

mvcexamp核心代码：

// controller
- (uitableviewcell*)tableview:(uitableview *)tableview cellforrowatindexpath:(nsindexpath *)indexpath{
    
    __weak typeof(self) wealself = self;
    mvctableviewcell *cell = [tableview dequeuereusablecellwithidentifier:@"cell_identifer"];
    if(cell == nil){
        cell = [[mvctableviewcell alloc] initwithstyle:uitableviewcellstyledefault reuseidentifier:@"cell_identifer"];
    }
    demomodel *model = self.dataarray[indexpath.row];
    [cell loaddatawithmodel:model];
    cell.clickbtn = ^{
        nslog(@"id===%ld",model.num);
        [wealself changenumwithmodel:model];
    };
    cell.selectionstyle = uitableviewcellselectionstylenone;
    return cell;
}
/*
* 用户点击事件通过block传递过来后，在controller层处理更新mdoel以及更新视图的逻辑
*/
- (void)changenumwithmodel:(demomodel*)model{
    
    model.num++;
    nsindexpath *path = [nsindexpath indexpathforrow:model.id insection:0];
    [self.maintabelview reloadrowsatindexpaths:@[path] withrowanimation:uitableviewrowanimationleft];
}

可以看到用户点击事件通过block传递过来后，在controller层处理更新mdoel以及更新视图的逻辑

2.mvp设计模式

mvpm: model 数据层，负责网络数据的处理，数据持久化存储和读取等工作
v: view 视图层，负责呈现从数据层传递的数据渲染工作，以及与用户的交互，这里把controller层也合并到视图层
p: presenter层，负责视图需要数据的获取，获取到数据后刷新视图。响应view的事件和作为view的代理。

可以看到 mvp模式跟原始的mvc模式非常相似，完全实现了view与model层的分离，而且把业务逻辑放在了presenter层中，视图需要的所有数据都从presenter获取，而view与 presenter通过协议进行事件的传递。

用户的交互逻辑

用户点击 view(视图) --> 视图响应事件 -->通过代理传递事件到presenter–>发起网络请求更新model–>model处理完数据–>代理或通知给视图(view或是controller)–>改变视图样式–>完成

mvp代码示例

项目结构

//demoprotocal
import <foundation/foundation.h>


@protocol demoprotocal <nsobject>
@optional
//用户点击按钮 触发事件： ui改变传值到model数据改变  ui --- > model 点击cell 按钮
-(void)didclickcelladdbtnwithindexpathrow:(nsinteger)index;
//model数据改变传值到ui界面刷新 model --- > ui
-(void)reloadui;
@end

我们把所有的代理抽象出来，成为一个protocal文件。这两个方法的作用：
-(void)didclickcelladdbtnwithindexpathrow:(nsinteger)index;:cell视图调用它去presenter层实现点击逻辑的处理
-(void)reloadui;: presenter调用它去更新主视图view或者controller

//presenter.h
#import <foundation/foundation.h>
#import <uikit/uikit.h>
#import "demoprotocal.h"

ns_assume_nonnull_begin

@interface presenter : nsobject
@property (nonatomic, strong,readonly) nsmutablearray *dataarray;
@property (nonatomic, weak) id<demoprotocal>delegate;//协议，去更新主视图ui
// 更新 tableview ui 根据需求
- (void)requestdataandupdateui;
//更新 cell ui
- (void)updatecell:(uitableviewcell*)cell withindex:(nsinteger)index;
@end

dataarray : 视图需要的数据源
- (void)requestdataandupdateui;:主视图controller调用，去更新自己的ui
- (void)updatecell:(uitableviewcell*)cell withindex:(nsinteger)index;:更新 cell的ui

//controller 层
- (void)inidata{
    self.presenter = [[presenter alloc] init];
    self.presenter.delegate = self;
    [self.presenter requestdataandupdateui];
}
...

- (nsinteger)tableview:(uitableview *)tableview numberofrowsinsection:(nsinteger)section{
    return self.presenter.dataarray.count;
}
- (uitableviewcell*)tableview:(uitableview *)tableview cellforrowatindexpath:(nsindexpath *)indexpath{
    
    mvptableviewcell *cell = [tableview dequeuereusablecellwithidentifier:@"cell_identifer"];
    if(cell == nil){
        cell = [[mvptableviewcell alloc] initwithstyle:uitableviewcellstyledefault reuseidentifier:@"cell_identifer"];
    }
    //更新cell ui 数据
    [self.presenter updatecell:cell withindex:indexpath.row];
    cell.selectionstyle = uitableviewcellselectionstylenone;
    return cell;
}

#pragma mark - demoprotocal
//presenter 的代理回调 数据更新了通知view去更新视图
- (void)reloadui{
    [self.maintabelview reloaddata];
}

controller层初始化presenter，调用其方法更新自己的ui，可以看到网络数据的获取，处理都在presenter中，处理完成后通过协议回调给controller去reload数据

//cell
- (void)addbtndown:(uibutton*)btn{
    nslog(@"%s",__func__);
    if([self.delegate respondstoselector:@selector(didclickcelladdbtnwithindexpathrow:)]){
        [self.delegate didclickcelladdbtnwithindexpathrow:self.index];
    }
}

cell层点击事件通过协议调用，而这个协议方法的实现是在presenter中实现的。

mvp模式也有自身的缺点，所有的用户操作和更新ui的回调需要定义，随着交互越来越复杂，这些定义都要有很大一坨代码。逻辑过于复杂的情况下，present本身也会变得臃肿。所以衍生出了mvvm模式。

3.mvvm+rac设计模式

mvvm
m: model 数据层，负责网络数据的处理，数据持久化存储和读取等工作
v: view 视图层，此时的视图层包括controller，负责呈现从数据层传递的数据渲染工作，以及与用户的交互
vm:viewmodel层，负责视图需要数据的获取，获取到数据后刷新视图。响应view的事件和作为view的代理等工作。
通过架构图可以看到，mvvm模式跟mvp模式基本类似。主要区别是在mvp基础上加入了双向绑定机制。当被绑定对象某个值的变化时，绑定对象会自动感知，无需被绑定对象主动通知绑定对象。可以使用kvo和rac实现。我们这里采用了rac的实现方式。关于rac如果不熟悉的小伙伴可以点这里,我们这篇文章不在涉及。

mvvm代码示例

我们这里包括两层视图：主视图controller以及cell，分别对应两层viewmodel：viewmodel和cellviewmodel

//viewmodel.h

@interface viewmodel : nsobject
//发送数据请求的rac，可以去订阅获取 请求结果
@property (nonatomic,strong,readonly) raccommand *requestcommand;
@property (nonatomic,strong) nsarray *dataarr;//返回子级对象的viewmodel
- (cellviewmodel *)itemviewmodelforindex:(nsinteger)index;
@end

raccommand *requestcommand:提供供主视图调用的命令，调用它去获取网络数据
nsarray *dataarr: 提供供主视图使用的数据源，注意这里不能用nsmutablearray，因为nsmutablearray不支持kvo，不能被racobserve。
- (cellviewmodel *)itemviewmodelforindex:(nsinteger)index; 根据cell的index返回它需要的的viewmodel

@interface cellviewmodel : nsobject

@property (nonatomic,copy,readonly) nsstring *titlestr;

@property (nonatomic,copy,readonly) nsstring *numstr;

@property (nonatomic,copy,readonly) raccommand *addcommand;

- (instancetype)initwithmodel:(demomodel *)model;

@end

cellviewmodel: 暴露出cell渲染需要的所有数据
raccommand *addcommand;: 按钮点击事件的指令，触发后需要在cellviewmodel里面做处理。

//controller
- (void)inidata{
    self.viewmodel = [[viewmodel alloc] init];
    // 发送请求
    racsignal *signal = [self.viewmodel.requestcommand execute:@{@"page":@"1"}];
    [signal subscribenext:^(id x) {
        nslog(@"x=======%@",x);
        if([x boolvalue] == 1){//请求成功
            [self.maintabelview reloaddata];
        }
    }];
}
- (uitableviewcell*)tableview:(uitableview *)tableview cellforrowatindexpath:(nsindexpath *)indexpath{
    
    mvvmtableviewcell *cell = [tableview dequeuereusablecellwithidentifier:@"cell_identifer"];
    if(cell == nil){
        cell = [[mvvmtableviewcell alloc] initwithstyle:uitableviewcellstyledefault reuseidentifier:@"cell_identifer"];
    }
    //更新cell ui 数据
    cell.cellviewmodel = [self.viewmodel itemviewmodelforindex:indexpath.row];
    cell.selectionstyle = uitableviewcellselectionstylenone;
        
    return cell;
}

inidata:初始化viewmodel，并发送请求命令。这里可以监听这个完成信号，进行刷新视图操作
cell.cellviewmodel = [self.viewmodel itemviewmodelforindex:indexpath.row]; 根据主视图的viewmodel去获取cell的viewmodel，实现cell的数据绑定。

//tableviewcell

    rac(self.titlelabel,text) = racobserve(self, cellviewmodel.titlestr);
    rac(self.numlabel,text) = racobserve(self, cellviewmodel.numstr);

    [[self.addbtn rac_signalforcontrolevents:uicontroleventtouchupinside] subscribenext:^(id x) {
        nslog(@">>>>>");
        [self.cellviewmodel.addcommand execute:nil];
    }];

在cell里面进行与viewmodel的数据绑定，这边有个注意racobserve左边只有self右边才有viewmodel.titlestr这样就避cell重用的问题。
[self.cellviewmodel.addcommand execute:nil];:按钮的点击方法触发，事件的处理在cellviewmodel中。