珠峰RxJS实战训练营
RxJS 是一个库,它通过使用 observable 序列号来编写异步和基于事件的程序。它提供了一个核心类型 Observable
, 附属类型(Observer、Schedulers、Subjects)和受[Array#extras]启发的操作符(map、filter、reduce、every,等等),这些数组操作符可以把异步事件作为集合来处理。
可以把 RxJS 当作是用来处理事件的Lodash
ReactiveX 结合了 观察者模式
、迭代器模式
和 使用集合的函数式编程
,以满足以一种理想方式来管理事件序列所需要的一切。
map
、filter
、concat
、flatMap
等这样的操作符来处理集合。setTimeout
或 requestAnimationFrame
或其他。Subject 是一种特殊类型的 Observable,它在观察者之间共享单一的执行路径。
你可以把它想象成一个人用话筒在全是人的房间里讲话,讲的话(主题)同时被传递给许多(多播)人(观察者)。这是多播的基础。典型的observable类似于一对一对话。
四种类型的Subject:
/*s1 n(r) n(x) s2 n(j) c n(s)Subjects1 ^-----r------x--------------j------|----------s2 ---------------------^------j------|----------AsyncSubjects1 ^----------------------------------j|---------s2 ---------------------^-------------j|---------BehaviorSubjects1 ^a----r------x--------------j------|----------s2 ---------------------^x-----j------|----------ReplaySubjects1 ^-----r------x--------------j------|----------s2 ---------------------^r-x---j------|----------*/
asyncScheduler
asapScheduler
尽可能快地执行任务异步执行
queueScheduler ????
将每个下一个任务放入队列,而不是立即执行
queue
调度器,当使用了delay,和asyncScheduler调度器的行为一致
import { queueScheduler } from 'rxjs';queueScheduler.schedule(() => {queueScheduler.schedule(() => console.log('second')); // will not happen now, but will be put on a queueconsole.log('first');})// Logs:// "first"// "second"
animationFrameScheduler
当 window.requestAnimationFrame 触发时执行任务