Rxjs ReplaySubjectを使ってみる 

ReplaySubject とは



ReplaySubjectは、Subjectの子クラスです。
ReplaySubjectは、
Observableの一部を記憶して、
新しいsubscribersで再度実行します。

次のコードでは、
実行されるsubscriberは、
subject.subscribe(
(x) => console.log(`observerA:`+x)
)
だけです。
バッファされていますが、
新しいsubscribersはありません。

したがって結果は、
observerA:1
observerA:2
observerA:3
observerA:4
observerA:5
になります。




const { ReplaySubject } =require('rxjs');
const subject = new ReplaySubject(2);

subject.subscribe(
(x) => console.log(`observerA:`+x)
);

subject.next(1);
subject.next(2);
subject.next(3);
subject.next(4);
subject.next(5);

【結果】
observerA:1
observerA:2
observerA:3
observerA:4
observerA:5




次のコードでは、
上のコードと同じように、
const subject = new ReplaySubject(2)
により、
最後のものから順に、2つバッファされています。

前とは違い、
subject.next(5)の後に、
subject.subscribe(
(x) => console.log(`observerB:`+x)
)
と、
subject.subscribe(
(x) => console.log(`observerC:`+x)
)
のコードを追加しています。

この2つのsubscribersで、
バッファされている2つの値、
4と5が実行されます。

結果は以前のものに、
observerB:4
observerB:5
observerC:4
observerC:5
が追加されます。




const { ReplaySubject } =require('rxjs');
const subject = new ReplaySubject(2);

subject.subscribe(
(x) => console.log(`observerA:`+x)
);

subject.next(1);
subject.next(2);
subject.next(3);
subject.next(4);
subject.next(5);

subject.subscribe(
(x) => console.log(`observerB:`+x)
);

subject.subscribe(
(x) => console.log(`observerC:`+x)
);

【結果】
observerA:1
observerA:2
observerA:3
observerA:4
observerA:5
//新しく加わる
observerB:4
observerB:5
observerC:4
observerC:5