RxJS学习笔记之Subject

本文为原创文章，转载请标明出处

目录

1. Subject
2. BehaviorSubject
3. ReplaySubject
4. AsyncSubject

1. Subject

总的来说，Subject 既是能够将值多播给多个观察者的特殊的可观察对象，因为可以添加观察者并使用 subscribe 方法来接收值；又是观察者，因为它有 next(v)、error(e)、complete() 方法。下面这段代码很好的说明了每个 Subject 既是 Observable 又是 Observer。

var subject = new Rx.Subject();subject.subscribe({ ?next: (v) => console.log(‘observerA: ‘ + v)});subject.subscribe({ ?next: (v) => console.log(‘observerB: ‘ + v)});subject.next(1);subject.next(2);

输出：

observerA: 1observerB: 1observerA: 2observerB: 2

2. BehaviorSubject

BehaviorSubject 能够保存当前值，当有新的观察者订阅时，就会立即从BehaviorSubject 接收到当前值。下面这段代码，初始值为0，尽管第二个观察者是在 2 发送出去之后订阅的，但是BehaviorSubject 保存了当前值，在第二个观察者订阅时立即从BehaviorSubject 接收到了当前值 2。

var subject = new Rx.BehaviorSubject(0);subject.subscribe({ ?next: (v) => console.log(‘observerA: ‘ + v)});subject.next(1);subject.next(2);subject.subscribe({ ?next: (v) => console.log(‘observerB: ‘ + v)});subject.next(3);

输出：

observerA: 0observerA: 1observerA: 2observerB: 2observerA: 3observerB: 3

3. ReplaySubject

ReplaySubject 和 BehaviorSubject 相似，ReplaySubject 能够保存指定个数的数据，当有新的观察者订阅时，就会从 ReplaySubject 接收到指定个数的这些值并回放出来。下面这段代码，指定能够保存 3 个数据，当第二个观察者订阅时，获取到保存的三个值 2、3、4。

var subject = new Rx.ReplaySubject(3); subject.subscribe({ ?next: (v) => console.log(‘observerA: ‘ + v)});subject.next(1);subject.next(2);subject.next(3);subject.next(4);subject.subscribe({ ?next: (v) => console.log(‘observerB: ‘ + v)});subject.next(5);

输出：

observerA: 1observerA: 2observerA: 3observerA: 4observerB: 2observerB: 3observerB: 4observerA: 5observerB: 5

另外，ReplaySubject 还可以指定 windowTime 来保存到目前为止多久之内的数据，下面这段代码，指定能够保存 100 个数据，指定能够保存到目前为止 500 毫秒之内的数据。

var subject = new Rx.ReplaySubject(100, 500);subject.subscribe({ ?next: (v) => console.log(‘observerA: ‘ + v)});var i = 1;setInterval(() => subject.next(i++), 200);setTimeout(() => { ?subject.subscribe({ ???next: (v) => console.log(‘observerB: ‘ + v) ?});}, 1000);

输出：

observerA: 1observerA: 2observerA: 3observerA: 4observerA: 5observerB: 3observerB: 4observerB: 5observerA: 6observerB: 6...

4. AsyncSubject

AsyncSubject 只能将执行完成时的最后一个值发送给观察者。下面这段代码，当 complete() 时才会将最后一个值 5 发送给第一个观察者和第二个观察者。

var subject = new Rx.AsyncSubject();subject.subscribe({ ?next: (v) => console.log(‘observerA: ‘ + v)});subject.next(1);subject.next(2);subject.next(3);subject.next(4);subject.subscribe({ ?next: (v) => console.log(‘observerB: ‘ + v)});subject.next(5);subject.complete();

输出：

observerA: 5observerB: 5

如有不当之处，请予指正，谢谢～