代码之家  ›  专栏  ›  技术社区  ›  Dzhavat Ushev

在mergeMap中使用concat

  •  0
  • Dzhavat Ushev  · 技术社区  · 8 年前

    我很难理解与使用 concat mergeMap

    的文档 康卡特 他说

    您可以传递一个观察值数组,也可以直接将它们作为参数。

    当我将可观察对象直接作为参数放置时,如下面的示例中所示,我在控制台中正确地得到了20和24。

    of(4)
      .pipe(
        mergeMap(number => concat(of(5 * number), of(6 * number)))
      )
      .subscribe(value => console.log(value));
    

    of(4)
      .pipe(
        mergeMap(number => concat([of(5 * number), of(6 * number)]))
      )
      .subscribe(value => console.log(value));
    

    live version 在闪电战中。

    知道为什么吗?这两个例子不应该是相同的吗?

    1 回复  |  直到 8 年前
        1
  •  1
  •   LordTribual    8 年前

    这两种情况是不同的,它们不应该完全相同。 concat 将可观测值作为参数,它将按顺序订阅这些流,并且仅在前一个流完成时订阅下一个可观测值。每个操作符或创建方法都返回一个可观察的。这意味着在第一个示例中,当您使用 康卡特 ,它将返回一个 20 然后 24 . 因为您处理的是嵌套的可观察对象,所以必须使用 mergeMap 它将订阅 .

    在第二个例子中,如果你传入一个数组, 康卡特 将转换此(使用 from() 内部)对于发出2个值的可观察值,这些值将再次被观察到。所以你在这里有3个层次的筑巢。第一个是最外部的可观测的源 of(4) ,第二个级别是映射到 合并地图 合并地图 合并地图

    concatArray() {
      of(4)
        .pipe(
          mergeMap(number => concat([of(5 * number), of(6 * number)])),
          mergeMap(x => x)
        )
        .subscribe(value => console.log(value));
    }
    

    另一种方法是 传播 不接收 ArrayLike

    concatArray() {
      of(4)
        .pipe(
          mergeMap(number => concat(...[of(5 * number), of(6 * number)]))
        )
        .subscribe(value => console.log(value));
    }
    

    20
    24