RxJs高阶运算——exhaustMap

时间:2022-06-01 12:44:31

上一节我们介绍了switchMap的特点,只要一个新的Source Observable到来,我们就订阅新的Observable,那么可能会有另一种情况就是,我们订阅第一个Source Observable,只有当这个Observable都完成的时候,如果之前有新的Observable到来,我们都忽略,这种情况就是我们今天介绍的exhaustMap.

为了学习exhaustMap,我们先得理解Exhaust的原理。

ExhaustMap

RxJs高阶运算——exhaustMap

Exhaust弹珠图

我们先来看看exhaust的弹珠图

 

RxJs高阶运算——exhaustMap

RxJs高阶运算——exhaustMap

弹珠图分析

就像之前一样,我们在第一行有一个高阶 Observable,其值本身就是 Observable,从第一行分叉。以下是此图中发生的情况:

1、就像 switch 的情况一样,exhaust 订阅了第一个内部 Observable (a-b-c)

2、像往常一样,值 a、b 和 c 会立即反映在输出中

3、然后发出第二个内部 Observable (d-e-f),而第一个 Observable (a-b-c) 仍在进行中

4、这第二个 Observable 被耗尽策略丢弃,并且不会被订阅(这是耗尽的关键部分)

5、只有在第一个 Observable (a-b-c) 完成后,耗尽策略才会订阅新的 Observable

6、当第三个 Observable (g-h-i) 发出时,第一个 Observable (a-b-c) 已经完成,所以这第三个 Observable 不会被丢弃,会被订阅

7、然后第三个 Observable 的值 g-h-i 将显示在结果 Observable 的输出中,这与输出中不存在的值 d-e-f 不同

 

就像 concat、merge 和 switch 的情况一样,我们现在可以在高阶映射的上下文中应用exhaust策略。

 

RxJs ExhaustMap操作符

现在让我们看一下exhaustMap 算子的弹珠图。让我们记住,与上图的第一行不同,源 Observable 1-3-5 发出的值不是 Observables

exhaustMap弹珠图

RxJs高阶运算——exhaustMap

exhaustMap弹珠图分析

1、值 1 被发出,并创建了一个内部 Observable 10-10-10

2、Observable 10-10-10 发出所有值并在源 Observable 中发出值 3 之前完成,因此在输出中发出的所有 10-10-10 值

3、在输入中发出一个新值 3,触发一个新的 30-30-30 内部 Observable

4、但是现在,当 30-30-30 仍在运行时,我们在源 Observable 中得到了一个新值 5

5、这个值 5 被耗尽策略丢弃,这意味着从未创建过 50-50-50 Observable,因此 50-50-50 值从未出现在输出中

好了,这里通过描述和图标大概分析了exhaustMap的原理。欢迎参与讨论。