RxJS 是一款流行的 JavaScript 响应式编程库，它提供了许多操作符来处理异步数据流。其中 exhaustMap 操作符是一个非常有用的操作符，它可以帮助我们控制异步流的并发度。本文将介绍 exhaustMap 操作符的使用方法和常见问题解决方法。
exhaustMap 操作符的基本用法
exhaustMap 操作符用于将一个内部的 Observable 映射成一个外部的 Observable，但是只有在内部 Observable 完成后才会订阅下一个内部 Observable。这意味着在内部 Observable 还没完成之前，任何新的事件都会被忽略。
下面是 exhaustMap 操作符的基本语法：
source$.pipe( exhaustMap(inner$) );
其中，source$ 是外部的 Observable，inner$ 是内部的 Observable。
下面是一个简单的示例代码：
-- -------------------- ---- ------- ------ - ---------- -------- - ---- ------- ------ - ---------- - ---- ----------------- ----- ------ - --------------------------------- ----- ------ - ----------------- --------- ------------ ------------- -- --------------- -------------------------
这段代码会在每次点击按钮时，发出一个内部 Observable，该 Observable 每隔 1 秒发出一个数字。由于 exhaustMap 操作符的作用，当第一个内部 Observable 还没完成时，任何新的点击事件都会被忽略。因此，我们可以避免出现多个内部 Observable 同时运行的情况。
解决常见问题
在使用 exhaustMap 操作符时，可能会遇到一些常见问题。下面是一些解决方法。
问题 1：内部 Observable 没有完成，但是需要取消订阅
在某些情况下，我们可能需要在内部 Observable 没有完成时取消订阅。例如，当用户在输入框中输入文字时，我们希望在用户停止输入后才发送请求。但是如果用户在输入过程中多次点击按钮，则可能会出现多个请求同时进行的情况。
为了解决这个问题，我们可以使用 switchMap 操作符。switchMap 操作符与 exhaustMap 操作符类似，但是它会在新的事件发生时取消订阅内部 Observable。因此，我们可以在用户输入时取消订阅内部 Observable，等用户停止输入后再发送请求。
下面是一个使用 switchMap 操作符的示例代码：
-- -------------------- ---- ------- ------ - ---------- -------- - ---- ------- ------ - --------- - ---- ----------------- ----- ----- - -------------------------------- ----- ------ - ---------------- --------- ------------ ------------ -- --------------- -------------------------
这段代码会在用户停止输入后，每隔 1 秒发出一个数字。
问题 2：内部 Observable 没有完成，但是需要立即发送新的事件
在某些情况下，我们可能需要在内部 Observable 没有完成时立即发送新的事件。例如，当用户在输入框中输入文字时，我们希望在用户停止输入后立即发送请求。但是如果我们使用 exhaustMap 操作符，则必须等待当前的请求完成后才能发送新的请求。
为了解决这个问题，我们可以使用 concatMap 操作符。concatMap 操作符会将新的事件追加到内部 Observable 的末尾，等待当前的事件完成后再发送新的事件。因此，我们可以使用 concatMap 操作符来满足我们的需求。
下面是一个使用 concatMap 操作符的示例代码：
-- -------------------- ---- ------- ------ - ---------- -------- - ---- ------- ------ - --------- - ---- ----------------- ----- ----- - -------------------------------- ----- ------ - ---------------- --------- ------------ ------------ -- --------------- -------------------------
这段代码会在用户停止输入后，立即发送一个请求，然后每隔 1 秒发出一个数字。
总结
exhaustMap 操作符是一个非常有用的操作符，它可以帮助我们控制异步流的并发度。在使用 exhaustMap 操作符时，我们可能会遇到一些常见问题，例如需要取消订阅内部 Observable 或立即发送新的事件。对于这些问题，我们可以使用其他的操作符来解决。在实际开发中，我们应该根据具体情况选择不同的操作符，以满足我们的需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6516c9a995b1f8cacdf19b7a