Question

我试图理解，mergeMap 在这个例子中是如何工作的，但仍然不明白。你能帮我吗？

import { interval } from 'rxjs';
import { mergeMap, take } from 'rxjs/operators';


// emit value every 1s
const source$ = interval(1000);

source$
  .pipe(
    mergeMap(
      // project
      val => interval(5000).pipe(take(2)),
      // resultSelector
      (oVal, iVal, oIndex, iIndex) => [oIndex, oVal, iIndex, iVal],
      // concurrent
      2
    )
  )
  /*
        Output:
        [0, 0, 0, 0] <--1st inner observable
        [1, 1, 0, 0] <--2nd inner observable
        [0, 0, 1, 1] <--1st inner observable
        [1, 1, 1, 1] <--2nd inner observable
        [2, 2, 0, 0] <--3rd inner observable
        [3, 3, 0, 0] <--4th inner observable
*/
  .subscribe(val => console.log(val));

https://stackblitz.com/edit/typescript-r3gcr4?file=index.ts&devtoolsheight=100

我不明白控制台中显示的值

我先谢谢你。

Answer 1

让我们将逻辑分解为简单的线程：

您的 source$ 计时器每秒发出值 0、1、2、3...。该线程通过您的管道，其中 mergeMap 用于修改您的线程。

并发值2表示每两个输入值将被传递并等待执行完成，然后接下来的2个值将被传递并执行，以此类推

你有选择器：[旧索引，旧值，当前索引，当前值]，让我们看看：

第一个值是0，从source$开始，将生成[0, 0, 0 ,0]，因为传入的值是0，而mergeMap中的当前值来自{ {1}} 也是 interval(5000)，
第二个值 0 从 1 开始 1000 毫秒后，将传递给 mergeMap，然后变异为值 source$，其中 [1, 1, 0, 0] - 作为第一个值和索引来自0, 0。对于每个管道值，将生成新的 interval(5000)。
5000 毫秒后，它从 interval(5000) mergeMap 生成第二个值和索引，因此在值为 1, 1 的第一个管道线程中它生成输出：0, 0。在值为 [0, 0, 1, 1] 的第二个管道中，它生成输出 1, 1。
现在接下来的两个值从 [1, 1, 1, 1] 转到 mergeMap：source$ 和 2, 2。因此，我们在 5000 毫秒后再次使用新的 3, 3 值 interval(5000) 和 0, 0 重复这些步骤。因此它生成 1, 1 和 [2, 2, 0, 0]，并在 5000 毫秒后生成 [3, 3, 0, 0] 和 [2, 2, 1, 1]。

然后继续。

mergeMap 运算符如何工作？

1 个答案: