RxJS: Operator forkJoin

Opublikowano: 10.12.2022 - tagi: JavaScript RxJS Operator

Do czego służy forkJoin?

Operator forkJoin pozwala na pobranie danych z kilku źródeł. Wynik zwraca, dopiero gdy dane zostaną pobrane ze wszystkich strumieni danych.

Przykłady użycia forkJoin

Przykład 1

Do forkJoin przekazany jest obiekt ze strumieniami danych:

import { forkJoin, of } from 'rxjs';

const numbers$ = of([1, 2, 3]);
const letters$ = of (['a', 'b', 'c']);

forkJoin({
    numbers: numbers$,
    letters: letters$.pipe(delay(2000))
}).subscribe(console.log); 
// Wynik:
// { numbers: [1, 2, 3], letters: ['a', 'b', 'c'] }

Zauważ, że wynik zostanie zwrócony po dwóch sekundach. Dopiero gdy dane z letters$ zostaną dostarczone.

Przykład 2

Do forkJoin przekazany jest tablica ze strumieniami danych:

import { forkJoin, of } from 'rxjs';

const numbers$ = of(1, 2, 3);
const letters$ = of ('a', 'b', 'c');

forkJoin([
    numbers$,
    letters$.pipe(delay(2000))
]).subscribe(console.log); 
// Wynik:
// [3, 'c']

Podobny przykład co poprzedni, ale są dwie różnice. Do forkJoin przekazujemy tablicę, a nie obiekt. W wyniku dostaniemy też tablicę. Dlaczego zwróciło nam: [3, 'c'] ? Zauważ, jak tworzone są strumienie danych: numbers$ i letters$. Przekazujemy tam listę ciąg liczb i znaków, a nie jak poprzednio tablicę liczb i znaków. Operator forkJoin zwraca po prostu ostatnie wysłane dane z podanego źródła.