【Angular】forkJoinで複数のObservableをまとめて処理する方法!

当ページのリンクには広告が含まれています。
forkjoin
この記事で解決できる悩み
いずみ

こんな悩みを解決できる記事を書きました!

僕は現役フリーランスエンジニア(歴年)で、資格は個保有しています。

RxJSで複数のObservableを並列に処理したいことってよくありますよね?

そういった場合に便利なのが「forkJoin」です。

いずみ

forkJoinを使えば、複数のObservableを並列で処理できます。

Promise.all()のRxJS版ですね。

本記事では、RxJSのforkJoinについて分かりやすく解説します。

本記事を読めば、RxJSのforkJoinをざっくり理解できるので早速見ていきましょう。

いずみ

すぐ読み終わるので、ぜひ参考にしてくださいね♪

執筆者/監修者
  • フリーランスエンジニア(保有資格個)
  • ブログ・アフィリエイト歴5年
  • ブランドせどりで月利50万円⇨脱サラ
  • 投資歴5年(仮想通貨・FXが得意)
  • Twitterフォロワー約2,000人
  • 運営者情報はこちら
いずみです
目次

forkjoinで複数のObservableを処理する方法

早速ですが、forkjoinで複数のObservableを処理する方法を解説します。

import { forkJoin } from 'rxjs';

forkJoin([
    observableA$,
    observableB$,
    observableC$
]).subscribe(
    data => {
        console.log(data[0]); // observableA$の返り値
        console.log(data[1]); // observableB$の返り値
        console.log(data[2]); // observableC$の返り値
    }
);

forkJoinを使うことで複数のObservableを並列で処理し、全Observableの完了を待って処理を行えます。

Promise.all()のRxJS版ですね。

いずみ

返却値の順番はforkJoinに指定したObservableの順番と同じになります。

けっこう便利なので重宝してます笑

まとめ

今回は、Angularのforkjoinについて解説しました。

以下が本記事のまとめになります。

まとめ
  • forkJoinを使うことで、複数のObservableの完了を待って処理を行える。
  • 返却値の順番はforkJoinに指定したObservableの順番と同じになる。
まとめ♪
  • おすすめ本
¥4,070 (2023/07/23 15:56時点 | Amazon調べ)

Angularの勉強なら「」が分かりやすくておすすめですよ♪

いずみ

最後までお読みいただき、ありがとうございました!

forkjoin

この記事が気に入ったら
フォローしてね!

シェアしてね!
  • URLをコピーしました!
目次