RxJs——takeUntil

今天我们继续学习takeUntil运算符。

我们知道take运算符是主要是限制发送一定次数的值之后就结束发送；按照这样的思路，我们猜想，这个takeUntil也是发送一定的值之后应该结束，那么具体是什么呢？

它将值从源 observable 传递给观察者，直到提供的称为通知 observable 发出其第一个值。它订阅源Observable，然后会监测源Observable；它还订阅了可观察的通知Observable。如果通知Observable发出一个值，则 takeUntil 取消订阅源Observable和通知Observable并完成。如果通知Observable没有发出任何值并完成，则 takeUntil 将传递所有值。

<figure class="image"></figure>从上面的图可以看出：

1、订阅源和通知者可观察对象

2、当一个新值从一个源 observable 到达时，将它发送给观察者

3、如果通知 observable 发出一个值，取消订阅两个 observable，将完整的通知发送给观察者

4、一旦源 observable 完成，将完成通知发送给观察者

5、如果源 observable 抛出错误，则向观察者发送错误通知

使用举例：

onst stream = interval(1000);

function component(source) {
   const notifier = new Subject();

   source.pipe(
       takeUntil(notifier)
   ).subscribe(render);

   return () => {
       notifier.next(null);
   };
}

const destroy = component(stream);

setTimeout(destroy, 3000);

function render(v) {
   const text = document.createTextNode(v);
   document.body.appendChild(text);
}

总结：

1、这个操作符其实就是满足一定条件的情况下结束整个Observable

2、这个操作符一般用于实现subject；