如何将API A的结果作为API B的参数输入？求所有实现方案

下面列出所有可行的实现方式，包含代码示例和场景说明：

• 嵌套订阅（基础但不推荐）
  这是最直接的写法，但多层嵌套后会形成回调地狱，代码可读性和可维护性差，不过确实是可行方案：

  apiA().subscribe({
    next: (aResult) => {
      apiB(aResult).subscribe({
        next: (bResult) => console.log('最终结果:', bResult),
        error: (err) => console.error('API B请求失败:', err)
      });
    },
    error: (err) => console.error('API A请求失败:', err)
  });
  

• 使用switchMap操作符（最常用的管道方案）
  这是RxJS处理依赖请求的标准方式，属于高阶映射操作符，会自动取消前一个内部Observable的订阅（适合HTTP这类单次流），错误可统一处理：

  import { switchMap } from 'rxjs/operators';
  
  apiA().pipe(
    switchMap((aResult) => apiB(aResult))
  ).subscribe({
    next: (bResult) => console.log('最终结果:', bResult),
    error: (err) => console.error('请求失败:', err)
  });
  

• 使用concatMap操作符
  严格按顺序执行请求，必须等前一个Observable完成后才会订阅下一个，适合需要保证执行顺序、不希望中断前请求的场景：

  import { concatMap } from 'rxjs/operators';
  
  apiA().pipe(
    concatMap((aResult) => apiB(aResult))
  ).subscribe({
    next: (bResult) => console.log('最终结果:', bResult),
    error: (err) => console.error('请求失败:', err)
  });
  

• 使用mergeMap（别名flatMap）操作符
  会立即订阅内部Observable，不等待前一个完成，适合API A是多值流、需要并发处理每个值对应API B请求的场景（单值流下和switchMap表现类似）：

  import { mergeMap } from 'rxjs/operators';
  
  apiA().pipe(
    mergeMap((aResult) => apiB(aResult))
  ).subscribe({
    next: (bResult) => console.log('最终结果:', bResult),
    error: (err) => console.error('请求失败:', err)
  });
  

• 使用exhaustMap操作符
  忽略新的内部Observable订阅请求，直到当前内部Observable完成，适合防止重复请求的场景（比如按钮防抖、避免重复提交）：

  import { exhaustMap } from 'rxjs/operators';
  
  apiA().pipe(
    exhaustMap((aResult) => apiB(aResult))
  ).subscribe({
    next: (bResult) => console.log('最终结果:', bResult),
    error: (err) => console.error('请求失败:', err)
  });
  

• 结合forkJoin保留双API结果
  如果需要同时获取API A和API B的结果，可以用forkJoin组合两个Observable：

  import { switchMap, forkJoin, of } from 'rxjs';
  
  apiA().pipe(
    switchMap((aResult) => forkJoin([of(aResult), apiB(aResult)]))
  ).subscribe({
    next: ([aResult, bResult]) => {
      console.log('API A结果:', aResult);
      console.log('API B结果:', bResult);
    },
    error: (err) => console.error('请求失败:', err)
  });
  

• Promise风格（async/await）
  将Observable转为Promise，用熟悉的async/await语法处理：

  import { firstValueFrom } from 'rxjs';
  
  async function fetchLinkedData() {
    try {
      const aResult = await firstValueFrom(apiA());
      const bResult = await firstValueFrom(apiB(aResult));
      console.log('最终结果:', bResult);
    } catch (err) {
      console.error('请求失败:', err);
    }
  }
  
  fetchLinkedData();
  

内容的提问来源于stack exchange，提问作者Deviya Kol