组合多个 RxJS 可观察对象并执行计数任务

Question

我是Rxjs新手，想知道这个问题能不能解决。

给定一个由 5 个 observable 组成的数组，每个都已经发出了一些数据，如下所示：

ary[0] : { 'a', 'b', 'c' }

ary[1] : { 'g', null }

ary[2] : { '1', 'f', '3', null }

ary[3] : { 'x', 'y', 'z'}

ary[4] : { 'h', 'v' }

我想要一个新的 observable，它发出值来计算这 5 个 observable 的最后一个非 null 元素。在上述情况下，新的 observable 发出的第一个值是 3 (c, z, v)。

每当从一个可观察对象发出新数据时，新的可观察对象也会发出计数结果。例如，当

ary[4] : { 'h', 'v' } 变为

ary[4] : { 'h', 'v', null }

新的 observable 将发出 2 (c ,z )。

Answer 1

您可以使用combineLatest 和随后的map：

const baseObs = [
  new Rx.Subject(),
  new Rx.Subject(),
  new Rx.Subject(),
  new Rx.Subject(),
  new Rx.Subject(),
]

const counter$ = Rx.Observable
  .combineLatest(baseObs)
  .map(dataList => dataList.filter(d => d != null).length);
  
counter$.subscribe(
  num => console.log(`Num is ${num}`)
);

baseObs[0].next("a");
baseObs[1].next(null);
baseObs[2].next(null);
baseObs[3].next("z");
baseObs[4].next("v");

setTimeout(() => baseObs[4].next(null), 300);

<script src="https://unpkg.com/rxjs/bundles/Rx.min.js"></script>