Go to Qiita Advent Calendar 2024 Top
LoginSignup
1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

@SOhtsu(Shuichi Ohtsu)

RxJS6 Cold ObservableとHot Observable

Posted at

Observableとストリーム

Angular6を利用しているとObservableが頻繁に出てきます。しかし、これは比較的イメージしづらいと思われます。

Observableとはバリュー(Value)やイベント(Event)のストリームとよく解説されています。

しかし、ストリームを川の流れのようにイメージすると、その後の理解を阻害する場合があります。

というのは、川は自然に流れ続けるイメージですので、Observableを定義しただけで、その流れが発生していると誤解しがちだからです。

そこでまず、Observableには、Cold ObservableとHot Observableの違いがあることを理解する必要があります。

前者のCold Observableは、定義しただけでは流れは発生しません。

受け手側で、subscribeを実行した時のみ、その流れは発生します。

その一方、Hot Observableでは、受け手側の状況に拘わらず、その流れが発生します。

これは通常の川のイメージと同様です。

こうした違いを明確にしておく必要があります。

ビデオ解説(日本語）
https://youtu.be/WsOqyG3_nnA

ビデオ解説(英語）
https://youtu.be/ufntWfqCJ4g

Cold Observable

まず、Cold Observableについて見てみましょう。

Observableは、イベントやバリューのストリームです。

しかし、Observableを定義しただけでは、まだ流れは発生していません。

それは受け手側、すなわちリスナーが、Subscribeを実行していないからです。

受け手側がFishについてのSubscribeを実行しました。魚が現れてきました。

ここで受け手側が、Unsubscriveを実行しました。魚の流れは消失しました。

Hot Observable

次は、Hot Observableについてです。

Hot Observableの場合は、受け手側の状態、すなわち、Subscribeを実行しているか否かに拘わらず、その流れは発生しています。

この典型的な例は、キーボード・イベントやマウス・イベントです。

ここで受け手側が、Subscribeを実行すると、その情報をほぼ同時に共有することができるようになります。

Reference

1
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?