关于RxJS 处理多个Http请求 串行与并行方法

mergeMap

mergeMap 操作符用于从内部的 Observable 对象中获取值，然后返回给父级流对象。

• 合并 Observable 对象

1 2 3 4 5 6

import { of } from "rxjs"; import { mergeMap } from "rxjs/operators"; const source$ = of("Hello"); const example$ = source$.pipe(mergeMap(val => of(`${val} World!`))); const subscribe = example$.subscribe(val => console.log(val));

在上面示例中包含两种 Observable 类型：

• 源 Observable 对象 —— 即 source$ 对象。
• 内部 Observable 对象 —— 即 of(${val} World!) 对象。

仅当内部的 Observable 对象发出值后，才会合并源 Observable 对象输出的值，并最终输出合并的值。

forkJoin

forkJoin 是 RxJS 版本的 Promise.all()，即表示等到所有的 Observable 对象都完成后，才一次性返回值。

• 合并多个 Observable 对象

1 2 3 4 5 6 7 8 9

import { timer, forkJoin } from "rxjs"; import { mapTo } from "rxjs/operators"; const getPostOne$ = timer(1000).pipe(mapTo({ id: 1 })); const getPostTwo$ = timer(2000).pipe(mapTo({ id: 2 })); forkJoin(getPostOne$, getPostTwo$).subscribe( res => console.log(res) );

 

原文地址：https://semlinker.com/rxjs-handle-multi-http-request/