文章封面

RxJS

2016年9月12日

介绍

RxJS是一个使用可观察序列来编写异步和事件驱动程序的库.官方的话是可以把它当做事件中的lodash.

Think of RxJS as Lodash for events.

ReactiveX使用迭代器模式,观察者模式和集合的函数式编程结合的方式来创造了一个管理事件序列的完美解决方式.

RxJS管理异步事件至关重要的几个概念:

  • Observable: 代表如何处理调用未来的值和事件
  • Observer:
  • Subscription:
  • Operators:
  • Subject:
  • Schedulers:

例子

实践出真知,试试才知道,试试就试试

先照着官方文档写一个小例子:

(⊙o⊙)… 试完之后第一感觉是

,坑爹啊,感觉不好用还多了好些代码. 不慌作为框架总是一定代码体积才能显示出他的优势,这点代码完全看不出来呀,继续试:

恩,这个统计点击数量的 demo 就感觉好多了,scan方法类似reduce,他接收一个函数和一个默认值,然后会把返回值传给下一个回调.

再来一个高端点的,1 秒内最多只能触发一次点击事件,恩,这里有个坑,官方文档中使用的是throttle,可其实这个方法接收的是一个函数,所以这里需要使用throttleTime,不然会报错: Rx.min.js:formatted:9841Uncaught TypeError: this.durationSelector is not a function.

再来看一下他封装的迭代器模式:

额,感觉其实也没啥,就是next的时候调用对应的回调.注意 5 并没有被打印,因为 complete 已经被调用.

再看看文档,各种方法满天飞,可以任意对事件做处理,感觉还是吊吊的,等研究研究再补充.

参考文献

RxJS Introduction