Angular/RxJS我应该取消订阅每个ajax电话吗？

Question

我应该取消订阅每个ajax电话吗？根据RxJS合同,我应该.因为AJAX调用不是流或事件,所以一旦完成它们就完成了.在这种特殊情况下,根本使用RxJS的原因是什么？超时它变得一团糟(我知道关于takeUntil,这不是重点).

public remove(data: IData): void {
  // unsubscribe from the previous possible call
  if (this.dataSubscription &&
      this.dataSubscription.unsubscribe) {
    this.dataSubscription.unsubscribe();
  }
  this.dataSubscription = this.dataService
    .delete(data.id)
    .subscribe(() => {
      this.refresh();
    });
}

public ngOnDestroy(): void {
  // unsubscribe on deletion
  if (this.dataSubscription &&
      this.dataSubscription.unsubscribe) {
    this.dataSubscription.unsubscribe();
  }
}

简单承诺的优点是什么,在执行后看起来更清洁和破坏？

public remove(data: IData): void {
  this.dataService
    .delete(data.id)
    .then(() => {
      this.refresh();
    });
}

这是DataService代码

@Injectable()
export class DataService {
  constructor(private _httpClient: HttpClient) { }

  public delete(id: number): Observable<IModel> {
    return this._httpClient.delete<IModel>(`${this._entityApiUrl}/${id}`);
  }
}

Answer 1

通常,您不需要取消订阅HttpClient呼叫,因为HttpClient一旦从服务器收到响应,所有呼叫都会完成流.一旦可观察流完成或出现错误,生产者就有责任释放资源.有关更多信息,请阅读Insider的拦截器指南和Angular中的HttpClient机制.只有在您要取消请求时才应取消订阅.

因为AJAX调用不是流或事件,所以一旦完成它们就完成了......比简单承诺更有优势,它在执行后看起来更清晰并且被破坏了？

AJAX调用不只是一次性事件.例如,您可以使用XHR创建多个进度事件.Promise只用一个值解析,同时HttpClient可以发出多个HTTP事件:

export type HttpEvent<T> =
HttpSentEvent | HttpHeaderResponse | HttpResponse<T>| HttpProgressEvent | HttpUserEvent<T>

Answer 2

有限的冷可观测量通常不需要取消订阅.在这方面,他们就像Promises一样工作.假设您在服务中使用Angular HttpClient,则不需要取消订阅 - 在这种情况下,它很像Promise.

首先,要清除一些东西 - 在你的Promise例子中,你必须通过分配它来管理Promise this.dataSubscription.在进行该调用this.dataSubscription.then()之后,在HTTP调用之后调用任意时间量的任何内容都将接收Promise.resolve()并调用该.then()函数.返回的新Promise Promise.resolve()将在执行后清理,但只有在你的类被销毁之后this.dataSubscription才会清理你的Promise.

但是,不将Promise指定为属性更清晰:

public remove(data: IData): void {
  this.dataService
    .delete(data.id)
    .then(() => {
      this.refresh();
    });
}

此外,Promise将在其范围的最后清理,而不是在类的破坏.

Observables,至少是有限的'Promise-like'之类的东西,工作方式大致相同.您不需要管理Subscription返回的购买.subscribe()方法,因为它将执行然后被清理,因为它没有被指定为属性:

public remove(data: IData): void {
  this.dataService
    .delete(data.id)
    .subscribe(() => {
      this.refresh();
    });
}

它是一个有限的Observable并在订阅后完成,因此subscribe再次调用将返回一个新的Subscription并重新调用Observable的函数.

无意中管理这些订阅确实很混乱,通常情况下可以做得更好.

与RXJS的订阅管理不同的是,RXJS可以成为一个非常强大的工具,一个是对的方式有用,这样比管理异步AJAX调用更多.您可以拥有向数百个订阅者发布数据的热Observable,向多个订阅者管理自己的流的主题,永不停止发出的无限Observable,管理状态的高阶Observable以及返回其他Observable等.在这种情况下取​​消订阅是最好的实践,但老实说,不会在极端情况下导致性能问题.

一个很好的比较是Observable.fromEvent()财产.就像removeEventListener之后正确使用的最佳做法一样addEventListener,您应该正确地取消订阅此Observable.然而,就像removeEventListener......,它并不是一直都在做,通常不会导致今天的平台出现问题.

此外,参考所述的'RxJS合同':这里是同一文档的摘录:

When an Observable issues an OnError or OnComplete notification to its observers, this ends the subscription. Observers do not need to issue an Unsubscribe notification to end subscriptions that are ended by the Observable in this way.

有限的Observables在排放后完成,不需要取消订阅.