Rxjs初探

笔者最近工做上接手了一个项目，一个后台管理工程，其中用到了Rxjs。新手上路，梳理一下大体的概念，不涉及太多具体API。

Observable

Observable(可被观测的东西)对象，可经过多种方法生成，它的指责是能够生产数据，并将数据以“流”的形式，发送给订阅者(Observer).

Observer

观察者，本质上也是订阅者（Subscriber），能够订阅Observable，当Observable生成数据时，观察者Observer可以接收到数据“推送”。这里的推送，本质上是在订阅时传入方法，供数据制造者调用。

Operator

Observable生成的一系列数据格式，并不必定是Observer须要的。此时能够使用调用Observable的的pipe函数，并将一系列operator函数做为pipe的参数使用，举个栗子🌰：

// 经过点击事件生成一个Observable对象，
// 每次点击一次，就产生一条数据
const observable = fromEvent(document, 'click')

// 定义一个观察者（订阅者）
const observer = data => {
  console.log(data)
}

// 第一种状况：没有通过pipe管道作数据变形的，最终的log结果是:MouseEvent
observable.subscribe(observer)

// 第二种状况，将每次的点击事件，都处理成一个特定的值，好比字符串'OK'
// 此时打印出来的结果就是"OK"了
const subscription = observable.pipe(mapTo('OK')).subscribe(observer)
复制代码

另外，执行subscribe方法之后，会返回一个subscription对象，当observer不须要再继续观察流数据的时候，能够调用unsubscribe方法，解除订阅关系。

subscription.unsubscribe()
复制代码

Subject

Subject是一种特殊的Observable，它能够把产生的数据发送给多个观察者，也就是这些观察者共享这些数据。同时Subject也能够充当Observer的角色。

const subject = new Subject()

// 此时的subject是Observable
subject.subscribe({
  next: value => console.log(value)
})

const observable = from([1, 2, 3]
// 此时的subject是observer
observable.subscribe(subject)
复制代码