RxJS 系列 – Observable to Subject (Hot, Cold, Warm, connectable, share)

前言

前两篇介绍了 Observable 和 Subject.它们有一个重大区别当 multiple subscribe 的时候.

Observable 每一次 subscribe 都会调用初始化方法, 并且创建出独立的一个 stream. 

Subject 则只是把 subscriber 存起来, next 的时候批量调用.

许多人也把 Observable 这种每一次都会创建出新的 source 的行为称为 Cold Observable

而向 Subject 那样每次 subscribe 不会创建出新 source 的行为称为 Hot Observable

参考: Medium – Hot vs Cold Observables

通常我们比较喜欢 Hot Observable (但不是 100%) 所以 RxJS 有一些方法可以把 Cold 变成 Hot.

这篇主要就是介绍这个.

Cold Observable Behaviour

const obs = new Observable(subscriber => {
  console.log('Observable init');

  let index = 0;
  const intervalNumber = setInterval(() => {
    subscriber.next(index++);
    if (index === 5) {
      clearInterval(intervalNumber);
      subscriber.complete();
    }
  }, 1000);

  return () => {
    console.log('Displose Observable');
    clearInterval(intervalNumber);
  };
});

obs.subscribe({
  next: v => console.log('first', v),
  complete: () => console.log('complete'),
});
setTimeout(() => {
  obs.subscribe({
    next: v => console.log('second', v),
    complete: () => console.log('complete'),
  });
}, 2000);

有一个 Observable, 被 subscribe 2 次

效果

它会创建出 2 个独立的 interval, 相互不影响.

Cold to Hot 原理

如果我们希望它只创建一次, 2 个 subscribe 订阅同一个 source 可以吗?

可以, 它的底层实现原理就搞一个中间人 Subject 出来.