为什么我们需要在 rxjs observable 中实现取消订阅？

Question

我们是否需要在可观察的 object 中返回我们自己的拆卸逻辑或取消订阅方法？

const observable = new Observable(function subscribe(subscriber) {
  // Keep track of the interval resource
  const intervalId = setInterval(() => {
    subscriber.next('hi');
  }, 1000);

  // Provide a way of canceling and disposing the interval resource
  return function unsubscribe() {
    clearInterval(intervalId);
  };
});

原因即使没有这条线：

  return function unsubscribe() {
    clearInterval(intervalId);
  };

observable.unsubscribe()正在工作。

那么有什么区别。 为什么我们需要那个？

更新即使没有返回自定义取消订阅方法，当我取消订阅时，以下间隔也会自动清除。

   this.myobs$ = new Observable((subscriber) => {
      let count = 0;
      setInterval(() => {
        subscriber.next(count++);
      }, 1000);
    });

this.myobs$.unsubscribe()

在下面的代码中，我们没有返回 unsubscribe 方法：

const hello = Observable.create(function(observer) {
  observer.next('Hello');
  observer.next('World');
  observer.complete();
});

在这里，我们将返回：

const evenNumbers = Observable.create(function(observer) {
  let value = 0;
  const interval = setInterval(() => {
    if (value % 2 === 0) {
      observer.next(value);
    }
    value++;
  }, 1000);

  return () => clearInterval(interval);
});

但事实是，即使没有明确的时间间隔，我的订阅也会在我取消订阅时取消（）

Answer 1

因为这是一个很好的练习。 它避免了 memory 泄漏。 想象一个应用程序，其服务向许多侦听器发送数据，如果您不取消订阅某个侦听器，则可观察对象的每次发送都会导致应用程序接收到不希望的数据。 最佳做法是在需要时订阅，在您不再需要接收时取消订阅。

Answer 2

这是为了提供对 Observable 逻辑的自定义拆解。

在这种情况下，您使用的是 setInterval，这是一种浏览器方法。因此，当您在没有自定义取消订阅的情况下取消订阅时。 观察者不会知道，它需要清除间隔，即使您取消订阅，间隔仍然会运行。

因此需要告诉 observable 当你取消订阅时， go 和 clearInterval

Answer 3

Observables 没有取消订阅方法，您需要订阅 object 来管理您的订阅。

const sub = obs$.subscribe(val => { doStuffWithVal(val); });

您的拆解 function 可以使用sub object 取消订阅sub.unsubscribe() 。

如果你不取消订阅，那么如果 observable 没有被垃圾收集并且你的 object 仍然被订阅，那么你可能会导致 memory 泄漏。

完成 observables 并在完成订阅后取消订阅是一种很好的做法。 进行不必要的拆解比 memory 泄漏要好。

Answer 4

因为 observable 不知道需要运行什么才能不监听不同的事件（例如，interval 是 clearinterval，timeout 是 clearTimeout，event 是 removeEventListener 等）

这就是为什么需要提供要执行的取消监听/取消订阅功能以真正清除事情。

为了演示，你应该看到下面的代码 console.log() 即使在你unsubscribe()之后仍在执行

   this.myobs$ = new Observable((subscriber) => {
      let count = 0;
      setInterval(() => {
        // it should continue to run even after unsubscribe
        console.log('interval running')
        subscriber.next(count++);
      }, 1000);
    }).subscribe();

this.myobs$.unsubscribe()