Rx中Promise同步问题：如何避免请求未完成时启动新请求？

这个场景我太熟悉了——本质上就是要把节流后的异步请求改成串行执行，避免并行触发导致的请求顺序混乱。毕竟RxJS里的异步操作默认是并行调度的，这和多线程完全没关系，就是单线程事件循环里的异步任务排队问题。

先分析原代码的问题 #

你给出的.NET风格代码对应到RxJS里大概是这样：

myChanges.pipe(
  throttleTime(200),
  map(async data => await someLongRunningWriteRequest(data))
).subscribe();

这里的map会把每个节流后的事件直接转换成Promise并触发执行，当请求耗时超过200ms时，新的Promise会在旧请求还没完成时就启动，而JavaScript的异步任务调度可能让后启动的请求先完成，最终导致写操作的顺序和事件触发的顺序不一致，这就是你遇到的核心问题。

核心解决方案：用concatMap替代map #

concatMap是RxJS专门用来处理串行异步任务的操作符：它会等待前一个由异步操作生成的Observable（这里就是Promise转成的Observable）完成后，才会订阅并执行下一个事件对应的异步请求，完美保证请求的执行顺序和事件触发顺序一致。

修改后的代码如下：

myChanges.pipe(
  throttleTime(200), // 先保留节流逻辑，控制事件触发频率
  concatMap(async (data) => {
    // 这里的异步请求会严格按顺序执行，前一个完成才会启动下一个
    await someLongRunningWriteRequest(data);
    return data; // 可选：返回处理后的结果，供后续订阅逻辑使用
  })
).subscribe({
  next: (completedData) => console.log(`请求完成：${completedData}`),
  error: (err) => console.error(`请求出错：${err}`)
});

其他可选操作符（根据需求选择） #

• 如果你的需求是当有请求在执行时，直接忽略新的节流后事件（比如只关心最后一次有效变更的请求，中间的变更可以丢弃），那可以用exhaustMap替代concatMap，它会在当前请求未完成时，直接跳过新的事件。
• 千万别用mergeMap（也就是旧版的flatMap），它是默认的并行执行逻辑，正是导致你问题的原因。

为什么这和多线程无关？ #

JavaScript是单线程模型，所有异步请求的回调都是在事件循环里排队执行的。我们这里说的“同步”不是指阻塞线程，而是指让异步任务按顺序排队启动，前一个任务的回调执行完成后，再启动下一个异步任务，完全是单线程内的调度控制，和多线程同步没有关系。

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