javascript - Angular Observables 返回匿名函数

Question

我有一个从 websocket 教程复制的方法，但我不明白 observable 中“return () => { ... }”的含义？有人可以解释一下这样做的目的是什么吗？

  public onMessage(topic: string, handler = SocketClientService.jsonHandler) : Observable<any> {
    return this.connect().pipe(first(), switchMap(client => { 
      return new Observable<any>(observer => {
        const subscription : StompSubscription = client.subscribe(topic, message => {
            observer.next(handler(message));
        });
        return () => {
          console.log("Unsubscribe from socket-client service");
          client.unsubscribe(subscription .id);
        }
      });
    }));
  }

Answer 1

为了创建 Observable，您可以使用 new Observable 或创建运算符。请参阅以下示例:

const observable = new Observable(function subscribe(subscriber) {
  subscriber.next(1);
  subscriber.next(2);
  subscriber.next(3);
});

您可以提供一个函数 unsubscribe() 来允许处置资源，该函数位于 subscribe() 内部，如下所示:

const observable = new Observable(function subscribe(subscriber) {
  subscriber.next(1);
  subscriber.next(2);
  subscriber.next(3);

  return function unsubscribe() {
    console.log('Clearing resources on observable');
  };
});

当然，您可以使用arrow function expression拥有:

const observable = new Observable((observer) => {
  observer.next(1);
  observer.next(2);
  observer.next(3);

  return () => {
    console.log('Clearing resources on observable');
  };
});

尝试使用以下代码来测试 Observable:

const subscription = observable.subscribe(res => console.log('observable data:', res));
subscription.unsubscribe();

最后，subscription.unsubscribe() 将删除示例中的套接字连接。

在此处查找使用这些示例运行的项目:https://stackblitz.com/edit/typescript-observable-unsubscribe

如果有帮助请告诉我!