forkjoin 마이그레이션

rxjs 6.5버전 부터 forkJoin으로 넘기는 인자의 형태가 달라졌다.

이전 사용방식 (< RxJS 6.5)

import { interval, forkJoin, of } from 'rxjs';
import { delay, take } from 'rxjs/operators';

const myPromise = val =>
  new Promise(resolve =>
    setTimeout(() => resolve(`Promise Resolved: ${val}`), 5000)
  );


const example = forkJoin(
  // 'Hello' 즉시 출력
  sourceOne: of('Hello'),
  // 1초 후에 'World' 출력
  sourceTwo: of('World').pipe(delay(1000)),
  // 1초 후에 0출력
  sourceThree: interval(1000).pipe(take(1)),
  // 1초 뒤 0, 2초 뒤 1 출력 (최종적으로 1이 남음)
  sourceFour: interval(1000).pipe(take(2)),
  // 5초 뒤에 resolve 값 출력  
  sourceFive: myPromise('RESULT')
);
/*
 * Output:
 * [ 
 *   "Hello", 
 *   "World", 
 *   0,
 *   1,
 *   "Promise Resolved: RESULT"
 * ]
 */
const subscribe = example.subscribe(val => console.log(val));

 

변경된 방식 ( RxJS 6.5<=)

1.

import { interval, forkJoin, of } from 'rxjs';
import { delay, take } from 'rxjs/operators';

const myPromise = val =>
  new Promise(resolve =>
    setTimeout(() => resolve(`Promise Resolved: ${val}`), 5000)
  );


// Using a dictionary of sources
const example = forkJoin({
  sourceOne: of('Hello'),
  sourceTwo: of('World').pipe(delay(1000)),
  sourceThree: interval(1000).pipe(take(1)),
  sourceFour: interval(1000).pipe(take(2)),
  sourceFive: myPromise('RESULT')
});
/*
 * Output:
 * { 
 *   sourceOne: "Hello", 
 *   sourceTwo: "World", 
 *   sourceThree: 0,
 *   sourceFour: 1,
 *   sourceFive: "Promise Resolved: RESULT"
 * }
 */
const subscribe = example.subscribe(val => console.log(val));

2.

import { interval, forkJoin, of } from 'rxjs';
import { delay, take } from 'rxjs/operators';

const myPromise = val =>
  new Promise(resolve =>
    setTimeout(() => resolve(`Promise Resolved: ${val}`), 5000)
  );


const example = forkJoin([
  // 'Hello' 즉시 출력
  sourceOne: of('Hello'),
  // 1초 후에 'World' 출력
  sourceTwo: of('World').pipe(delay(1000)),
  // 1초 후에 0출력
  sourceThree: interval(1000).pipe(take(1)),
  // 1초 뒤 0, 2초 뒤 1 출력 (최종적으로 1이 남음)
  sourceFour: interval(1000).pipe(take(2)),
  // 5초 뒤에 resolve 값 출력  
  sourceFive: myPromise('RESULT')
]);
/*
 * Output:
 * [ 
 *   "Hello", 
 *   "World", 
 *   0,
 *   1,
 *   "Promise Resolved: RESULT"
 * ]
 */
const subscribe = example.subscribe(val => console.log(val));

참고

https://github.com/ReactiveX/rxjs/blob/master/src/internal/observable/forkJoin.ts