カテゴリー
【Rxjs活用講座】publish().refCount() と share() の微妙な違い
※ 当ページには【広告/PR】を含む場合があります。
2020/07/10
2022/10/05
「
publish().refCount()share()ですがこの双方は決して置き換え可能ではありません。
今回はどのように違うのかのワンポイント講座です。
TL;DR
まずは結論から。
publish().refCount()Complete対して、
share()文面だけだと少しイメージが付きにくいと思いますので、以降では具体例を交えつつこの特性を説明していきます。
shareオペレーターの使い方
shareおさらいになりますが、shareオペレーターはColdなストリームをHotなストリームに分配する関数です。
publishオペレーターはconnectメソッドを使ってHOTストリームを開始するタイミングを明確にコードの中に実装する必要があります。
shareではconnectメソッドがなくてもsubscribeを受け取るとストリームが即時発行される仕様です。
import { Observable } from 'rxjs';
import { of } from 'rxjs';
import { switchMap, share } from 'rxjs/operators';
function hot$() : Observable<any> {
console.log(`👇Hot stream is getting started.`);
return of(1).pipe(
switchMap(_ => of(new Date())
),
share() // HOTストリームで分配 + 支流は即時処理を開始
);
}
const share$ = hot$();
share$.pipe(
tap(_ => console.log('Sub stream #1 :'))
).subscribe(
res => console.log(res),
err => console.log(err),
() => console.log('Sub stream #1 is Finished!')
);
share$.pipe(
tap(_ => console.log('Sub stream #2 :'))
).subscribe(
res => console.log(res),
err => console.log(err),
() => console.log('Sub stream #2 is Finished!')
);
このコードをビルドして、
node $ node dist/index.js
👇Hot stream is getting started.
Sub stream #1 :
2020-07-09T16:54:26.568Z
Sub stream #1 is Finished!
Sub stream #2 :
2020-07-09T16:54:26.575Z
Sub stream #2 is Finished!
これは前回の内容と同様です。
Coldなストリームが
shareSub stream #1Sub stream #2つまり、
share「publish().refCount()」の使い方
それでは次に
publish().refCount() import { Observable } from 'rxjs';
import { of } from 'rxjs';
import { switchMap, publish, refCount } from 'rxjs/operators';
function hot$() : Observable<any> {
console.log(`👇Hot Stream is getting started.`);
return of(1).pipe(
switchMap(_ => of(new Date())
),
publish(), // HOTストリームとして分配するだけ
refCount() // 分岐したストリームは任意のタイミングで開始
);
}
const publishRefCount$ = hot$();
publishRefCount$.pipe(
tap(_ => console.log('Sub stream #1 :'))
).subscribe(
res => console.log(res),
err => console.log(err),
() => console.log('Sub stream #1 is Finished!')
);
publishRefCount$.pipe(
tap(_ => console.log('Sub stream #2 :'))
).subscribe(
res => console.log(res),
err => console.log(err),
() => console.log('Sub stream #2 is Finished!')
);
このコードもビルドして、実行してみましょう。
$ node dist/index.js
👇Hot stream is getting started.
Sub stream #1 :
2020-07-09T16:54:26.578Z
Sub stream #1 is Finished!
Sub stream #2 is Finished!
こちらは
sharerefCountsubscribeshareこのコード例の場合、まずHotに分岐された支流のうち、先に
Sub stream #1Sub stream #2同じ処理をしているので当然
Sub stream #1Sub stream #2すなわち、
publish().refCount()まとめ
では今回のポイントを復唱しておきましょう。
publish().refCount()Complete対して、
share()参考サイト
記事を書いた人
ナンデモ系エンジニア
主にAngularでフロントエンド開発することが多いです。 開発環境はLinuxメインで進めているので、シェルコマンドも多用しております。 コツコツとプログラミングするのが好きな人間です。
カテゴリー