RxSwift实战RXSwift 实战函数响应编程&MVVM

[翻译]一个iOS开发人员的日常--RxSwift的使用

2016-10-16  本文已影响973人  openlab

原文:https://realm.io/news/tryswift-Marin-Todorov-I-create-iOS-apps-is-RxSwift-for-me/

在本次try! Swift NYC talk活动中,Marin Todorov介绍了RxSwift在一个iOS开发人员日常工作中的使用案例(RxSwift是一个异步,基于事件处理的框架)。如果你希望以引入一个库的成本来解决你大半部分的痛苦的话,那么这篇文章对你最合适不过。

简单介绍

Reactive Extensions,简称Rx,大量采用了observable序列和link style操作运算,是用来解决事件和异步处理的库,使用这个库,开发者处理异步数据流不要太爽。

Marin表示说,我读了Rx理论很多次,但是我也没法搞清楚iOS开发日常中如何去使用它,我踩过一些坑,今天就想介绍一下我用Rx解决过的一些实际问题。

Rx响应式的应用

首先来看看Rx响应式的方面。使用Rx的响应式,数据改变后会直接push到你 而不需要你再次主动pull数据。

Array < String >

这个array,作为一个strings的集合类,有时候处理起来有点小麻烦,你需要去遍历它其中每个子元素,根据子元素的情况去处理数据,即便采用更Swifty的方法,比如forEach这样的,也还是挺麻烦,因为本质都还一样,你需要提供一个闭包,一些block的代码,得一个元素接一个元素的处理。

问题在于,你处理这个array的时候,是在一个固定的时间点,而这个时间点的数据也是固定的。而有新数据加到这个array中的时候,你是不知道的。

拿table view controller来举例。它绑定一个含有三个元素的array,用户点击增加的按钮,array里数据变成四个了,但是界面上还是三个。你或许可以采用通知或者委托的方式来同步数据model和UI这样。但是如果添加数据恰好是个异步耗时的过程,那就有点麻烦了。

Observable < Array < String > >

Rx把数据封装成一个observable类,这样一个类,可以让你本来的数据有时间的跨度,简单的说,是给数据加上一个"时间的维度"

在这个例子中,observable序列定义了每个元素需要做的处理方法,例如:print每个元素。在初始化的时候,每个元素会执行一遍这个方法。当有新元素加入的时候,会再执行一遍这个方法,以前你需要不仅要定义管做什么事情,还要管什么时间做,现在你只需要这些元素各自的处理方法,然后一但数据有新的变化,会自动执行处理方法。

我觉得这就是Rx最牛逼的地方,把需要异步处理变成线性的,这样就把事情简化了。你都不需要考虑你现在有啥数据,过去有啥数据,将来可能都有啥情况,而只需要定义数据驱动的处理方法块就可以了。在上面的例子中,你如果想在tableview里显示一个list,就只需要线性的码好从数据到UI的渲染代码。把list中元素加加减减,数据变化驱动的错综复杂事件和交互都交给RxSwift打点就好。
Observables特别好用,再举个例子,你在text filed输入的字符串需要在某个label中显示,你只要实现数据如何显示到label的代码就行了,其他用户输入事件的激活等其他环节就交给RxSwift。
有了RxSwift,事情变得触手可及,简单,且线性
再考虑一个复杂点的情况,scrollview中的翻页加载数据问题,如果启用了RxSwift,你只需要实现的翻页代码就比较简单了:只需要实现从服务器加载20条数据并加入到list当中的这段代码即可。每次scroll到底部都会执行这段相同的代码并显示到界面上。这样把精力简单的集中在这段代码块就可以了。

Rx中的函数式

来看下这些通常带有预先设计的,伟大的observables类
我们之前的三个例子中,每个里面都涉及到一个observable类。
例如text field中的text就转化为Observable<String>。只要把text封装到成一个observable,所有关于text的变化都通过这个observable string像信号源一样来发射出来。而table view controller的那个例子中,数据源变成了一个Observable<Array<...>>,一个包含string的array。在scrolling的例子中,并没有数据,那就封装成一个Observable<Void>,因为我们感兴趣的只是用户触及scrollview底部的事件本身。
在这些情况中,你主要操作的都是同一个类,不管里面包含什么数据源,array也好,string也好,或者其他的什么也好,他们都是observables,你只需要关注你对observables的操作,比如行为定义这些。这种对数据源的observable封装类,你可以在不同项目中通过复制粘贴来复用,或者抽象成一个基础框架,这样在具体的项目中,就只需要集中处理具体的数据类型了。
下面我们来看一个Rx入门的小例子:
有一个app,需要实现一个textfield,用户输入文字后能查询到匹配的代码仓库。我们依然采用有伟大的有前途的observables.界面上是一个textfield,它输出一个Observable<String>。通过它,用户每次输入改变都能获得一个新的String;
observable的有个“filter”函数能帮我们忽略掉不符合条件的数据,比如,两个字母就不要搜了,搜出来的结果也没什么关联的。而且特别赞的一点是,filter这个函数返回值也仍然是个observable实例。这意味着在结果上仍然可以执行对应的函数,分分钟搞出链式语法。接下来我调用debounce函数。
debounce是用来干嘛的呢?它用来过滤太密集的一些事件,只取最后一个.比如用户输入的时候不需要每个字母敲进去都发送一个事件,只要稍等一下,取最后一个事件就行了。
下一个要介绍的是map函数,这个函数---函如其名,把输入数据映射成输出数据的样子。比如这个例子中,输入一个string,对应就得生成一个URL,那么从string到NSURLRequest就有一次map。经过上述的函数链条,每一次输入都会引发一次输出。
FlatMap函数会允许我们创建一个网络请求,并等待服务器结果返回。返回是一个NSData类型,进行一次map函数处理,利用NSJSONSerialization转化成Array<AnyObject>。
如图14所述是这个app整个的工作流。从textfield的键盘输入,到数据校验,到网络请求,再到数据转化,最后得到一个代码仓库的列表,可能以Realm的方式存储下来。这个流程非常优秀,因为它是线性的,很容易就知道一个步骤接下来的下一个步骤,也不需要去管数据的protocol或者delegate那些看起来很分散的东西。所有的流程是序列化的,一个接一个的发生。
下面这个代码从storyboard引出textfield的outlet,然后引入Rx框架,实现一下这段代码

query.rx_text

  .filter {string in
      return string.characters.count > 3
  }

  .debounce(0.51, scheduler: MainScheduler.instance)

  .map {string in
      let apiURL = NSURL(string: "https://api.github.com/q?=" + string)!
      return NSURLRequest(URL: apiURL)
  }

  .flatMapLatest { request in
      return NSURLSession.sharedSession().rx_data(request)
  }

  .map { data —> Array<AnyObject> in
      let json = try NSJSONSerialization.JSONObjectWithData(data, options: [])
      return json as! Array<AnyObject>
  }

  .map {object in
      return Repo(object: object)
  }

  .bindTo(tableView.rx_itemsWithCellIdentifier("Cell"))

我们调用filter函数,和filter函数中实现的函数体,然后调用debounce,设置有效事件的时间间隔,然后调用map,把string映射到URL然后是URLRequest,然后调用了FlatMap函数,把其中每个元素都调起一个URLSession来发起网络请求,数据从服务器返回来后,再发起一次map的调用通过NSJASONSerialization来处理NSData,最终转换成repo对象。在链条的最末端调用的bindTo可以把输出的repo数据列表绑定到tableview中,直接调用了tableView的CellIdentifier函数就可以完成绑定。

看起来这些代码又简单又短并不是啥代码,但是可以引发一些好的思考。你花了15分钟体验了一下Rx思维。这些简单的代码告诉你用Rx你可以干的事情。这些代码段都是线性完成的,一看就知道一块代码接下去的下一段代码是要干啥。团队的新成员很容易就读懂了代码逻辑,这种线性方式也能让你很容易就看懂6个月前的代码。
最好的地方是我不是通过一个对象和另外一个对象的关系来调用代码,而是链式的调用。链条中每一段代码块都有输入输出,也依赖上游的输出,影响下游的输入。上下游之间是紧密相连的。一旦编译成功,整个链条就不接受任何改变从而保证代码过程顺利的运行。

函数响应式App框架

这个话题跟我的iOS程序有多大关系呢。
我们来看看一个更复杂点的需要弹出新ViewController的情况。在app中有一个NavtigationController,其中有个包含repos列表的tableview,一个添加新repo的模态方式的viewcontroller。用户通过键盘添加信息,点击“Done”按钮,然后数据需要发生变化。平常,我们的解决办法是实现一个delegate,并在协议里定义viewcontroller之间的交互和调用方法,这显然是有点麻烦的。现在来试试新的解决方案。
我们有个全局的类,通过它我们可以跟任何类进行交互。这个类就是我们的observable。比如在Add Repo的viewcontroller中可以包含一个observable属性。每次用户点击done之后就发射出新加入的数据,那么事情会变得非常简单。
下面这段源代码从点击右上角的“+”按钮开始。在Rx的框架中,tap会返回来一个observable,每次用户点击+按钮都会产生一次动作。

  addBarItem.rx_tap

    .debounce(0.5, scheduler: MainScheduler.instance)

    .flatMapFirst {[weak self] _ —> Observable<Repo> in
        let addVC = AddRepoViewController()
        self?.presentViewController(addVC, animated: true, completion: nil)
        return addVC.newRepo.asObservable()
    }

    .doOn {_ in
        self.dismissViewControllerAnimated(true, completion: nil)
    }

    .subscribeNext {repo in
        repos.value.append(repo)
    }

repos.asObservable()
    .bindTo(tableView.rx_itemsWithCellIdentifier("Cell"))

这里我又用到了debounce函数,用来避免按钮被多次点击。如果用户手欠点“+”点的特别快,那么可能打开多个viewcontroller,rx框架里用debounce函数就避免了这种情况,只会打开一次。
来看看FlatMap在里面干了什么,之前的例子当中,我们用它来做了一些耗时的处理工作。这也是可以应用到这里的,present一个viewcontroller然后等待直到它被关闭,通过暴露出一个observable属性,来返回一个新的repo。然后再关闭这个viewctroller。在链条的最后对返回的数据进行处理。在这个例子中,新生成的repo返回后需要触发前一个列表窗口的数据更新。所以这里,我们把repos列表绑定到了tableview中。
这样的MVVM的模式相当快速,只要生成一些viewcontrollers,暴露一些models来驱动他们的数据,这就是你主要引入Rx代码的地方,通过数据驱动,在这个链条的最后可以吧数据渲染到UI上。这个过程串起来相当清晰的。
业务逻辑和界面的代码分离的很清楚。所有的逻辑代码都在view model中。所以可以在这一层写case做测试。也不需要涉及到viewcontroller的初始化这些东东。这样的模式里,模块的边界变得显而易见。

RxSwift

RxSwift是一个长着同步脸的异步框架
它有函数式编程的一面,用来处理异步事件,比如各种转换还有别的东东。也引入了很好的架构模式,其实跟iOS的开发关联可以非常紧密的。

进一步的资料可参考

ReactiveX.io

Rx有多种平台多种语言的实现,在这个网站上你可以找到一些官方的API说明,包含Swift,Java,JS和Skala版本哦

RXSwift.org,rx-marin.com

这里有我写的一些关于Rx的东东,可以看看,加深理解

最后,非常感谢鼓励我的Ash Furrow,帮助我理解基础要点的Jens Ravens,早期帮我改代码的Florent Pillet,跟我一起玩Rx的朋友,Junior Bontognali,以及发起RxSwift项目的牛人Krunoslav Zaher

上一篇下一篇

猜你喜欢

热点阅读