Angular中Observable仅返回单值时，concatMap与switchMap的选型

我已经清楚当Observable返回多个值时concatMap与switchMap的区别，但如果所有Observable都仅返回单个值，使用其中一个相比另一个是否存在优势？以下是构造函数中调用逻辑完全一致的示例，分别采用concatMap和switchMap，这种场景下更推荐使用哪一个？

import { Component } from '@angular/core';
import { concatMap, forkJoin, Observable, of, switchMap } from 'rxjs';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {

  var1: any[];
  var2: any[];
  detailVar: any;


  func1(): Observable<any[]> {
    return of([
      { id: 1, value: 'One' },
      { id: 2, value: 'Two' },
      { id: 3, value: 'Three' }
    ])
  }

  func2(): Observable<any[]> {
    return of([
      { id: 4, value: 'Four' },
      { id: 5, value: 'Five' },
      { id: 6, value: 'Six' }
    ])
  }

  funcDetail(): Observable<any> {
    return of(
      { id: 1, name: 'name', oneId: 2, twoId: 5 }
    )
  }

  constructor() {

    // concatMap
    this.funcDetail().pipe(concatMap((data) => {
      this.detailVar = data;
      return forkJoin([
        this.func1(),
        this.func2()
      ])
    })).subscribe((dds) => {
      this.var1 = dds[0];
      this.var2 = dds[1];

      console.log(this.detailVar);
      console.log(this.var1);
      console.log(this.var2);
    });


    // switchMap
    this.funcDetail().pipe(switchMap((data) => {
      this.detailVar = data;
      return forkJoin([
        this.func1(),
        this.func2()
      ])
    })).subscribe((dds) => {
      this.var1 = dds[0];
      this.var2 = dds[1];

      console.log(this.detailVar);
      console.log(this.var1);
      console.log(this.var2);
    });
  }
}

当所有涉及的Observable都只发送单个值后立即完成时，concatMap和switchMap的实际运行效果完全一致，理由如下：

• concatMap的核心逻辑是"排队等待"：只有前一个内部Observable完成后，才会订阅下一个。但在你的场景里，源Observable（funcDetail）只发送一次值，内部的forkJoin也只会发送一次结果就完成，不存在需要排队的后续任务，所以排队逻辑不会生效。
• switchMap的核心逻辑是"切换取消"：如果源Observable发送新值，会立即取消前一个内部Observable的订阅，转而订阅新的。但这里源Observable只发送一次值，没有后续的新值触发切换，所以取消逻辑也不会生效。

推荐选择 #

如果只看当前场景，两者任选都没问题，但可以从语义贴合度和未来维护性考虑：

1. 语义层面：如果你的业务逻辑强调"必须等待前一步完成再执行后续"（哪怕当前是单值场景），选concatMap更贴合语义；如果逻辑是"用新的请求结果覆盖旧的"，选switchMap更合适。在你的示例中，两种语义都能说得通，但switchMap在RxJS社区中更常用于这种"先取基础数据，再并行请求关联数据"的场景。
2. 维护层面：如果未来funcDetail可能会多次发送值（比如用户操作触发重复调用），那选switchMap会自动取消旧的请求，避免无效请求和数据覆盖问题；如果需要保留所有请求的结果，就选concatMap。

回到你的示例代码，两种写法的控制台输出完全一致，不会有任何差异。

内容的提问来源于stack exchange，提问作者Jeffrey Bane