RxJS 可以写出更短更内聚的代码,但是编写和理解的难度较大;Callback 版本虽然朴实无华,但是便于编写以及理解,可维护性更好。

Reactive Extension

assembly-line

An API for asynchronous programming with observable streams

Reactive Extension(也叫ReactiveX),指的事实践响应式编程的一套工具,Rx扩展了那些不支持响应式编程的语言的功能,让开发者可以更方便地以函数式和响应式风格来开发应用。
函数响应式编程(Functional Reactive Programming)的优势

  • 数据流抽象了很多现实问题
  • 擅长处理一步操作
  • 把复杂问题分解成简单问题

理解Observable与Observer

顾名思义,Observable就是“可被观察者(对象)”,Observer为“观察者”。
两者之间的桥梁为subscribe.为了让两者之间可以互动,Observable实现了下面两种设计模式:

  • 观察者模式(Observer Pattern)
  • 迭代器模式(Iterator Pattern)

Observable = Publisher + Iterator

Hot Observable 与 Cold Observable

Think of a hot Observable as a radio station. All of the listeners that are listening to it at this moment listen to the same song.
A cold Observable is a music CD. Many people can buy it and listen to it independently.
—Nickolay Tsvetinov

Hot Observable

一旦Hot Observable被创建了,不管有没有订阅者,它们都会开始发送数据。
相同时间开始订阅的订阅者会得到同样的数据。
Cold Observable的创建就是一般的创建方法。API中提供了相关的方法能将Cold Observable转化为Hot Observable。

Cold Observable

所有的Observable默认都是Cold Obserable。这就是说我们使用诸如Observable.create()或者Observable.fromArray()这类的方法所创建出来的Observable都是Cold Observable。
任何订阅Cold Observable的订阅者都会接收到独立的数据流。
如果没有订阅者订阅,它就什么事情也不会做,是被动的。

弹珠图(Marbles Diagram)

0123
RxJS中的Observable代表一个数据流.

  • 弹珠:每一个吐出来的数据
  • 间隔:数据与数据之间的时间间隔
  • 竖杠符号(|):代表数据流的完结(complete)
  • x符号:代表数据流中的异常(error)

弹珠图工具

http://rxmarbles.com
https://rxviz.com
在学习过程中借助工具能够加深对RxJS的理解。