RxJS:推迟观察项目的生成

时间:2016-03-14 11:18:15

标签: javascript reactive-programming rxjs

假设我有一个observable,它生成从09的元素。我希望有一个新的observable,它只会在3之后发出7。我相信它看起来应该是这样的:

// INPUT:  0 - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9
// OUTPUT: 0 - 1 - 2 ----- 4 - 5 - 6 - 7 - 3 - 8 - 9 

let source = Rx.Observable.range(0, 10).XXX([
    item => item === 3,
    item => item === 7
]);

RxJS是否包含此类XXX方法?

1 个答案:

答案 0 :(得分:2)

我不知道存在哪种方法,但是,我们可以尝试解决问题。让我们将潜在的观察者分成两个流;一个满足我们的谓词(即x => x === 3)和一个值不满足该谓词的那个:

const item$ = Rx.Observable.range(0, 10);
const predicate = x => x === 3;

// Split our underlying stream into two Observables; one where each value
// will equal three, and the other where each value is not three.
const [ three$, notThree$ ] = item$.partition(predicate);

我们可以创建一个只要出现数字7就会发出的流:

const seven$ = notThree$.filter(x => x === 7);

现在,让我们在发出7之前和

之后制作两个流来表示我们的基础数据
const beforeSeven$ = notThree$.takeUntil(seven$);
const afterSeven$ = notThree$.skipUntil(seven$);

最后,我们可以将这些流组合起来以达到预期的效果。一旦我们的beforeSeven $流结束,我们基本上连接了afterSeven $和三个$ stream:

const result$ = beforeSeven$.concat(three$.merge(afterSeven$);

这是console.log结果的问题:https://jsfiddle.net/cbelden/ppjmxww1/