.subscribe() 函数有啥作用？

Posted 2023-02-22

【中文标题】.subscribe() 函数有啥作用？

【英文标题】：What does the .subscribe() function do?.subscribe() 函数有什么作用？

【发布时间】：2017-06-19 10:41:51

【问题描述】：

我正在使用Angular2 和NodeJS 编写API，我正在为我的ِAPI 实现服务，该服务应该获取任务列表并显示它。这里是任务服务：

import Injectable from '@angular/core';
import Http, Headers from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class TaskService
  constructor(private http:Http)
    console.log('Task Service Initialized...');
  
  getTasks()
    return this.http.get('http://localhost:3000/api/tasks')
      .map(res => res.json());
  

对于我的getTask 函数（如果我错了，请纠正我）.map() 函数接收我的响应并将其格式化为一组值。 现在是使用任务服务的任务组件：

import  Component  from '@angular/core';
import TaskService from '../../services/task.service';

@Component(
  moduleId: module.id,
  selector: 'tasks',
  templateUrl: 'tasks.component.html',
)
export class TasksComponent  
  constructor(private taskService:TaskService)
    this.taskService.getTasks()
      .subscribe(tasks =>
        console.log(tasks);
    )
  

我想了解这个.subscribe() 函数的作用，但我找不到任何相关信息。

【问题讨论】：

一个好的开始：reactivex.io/rxjs/manual/overview.html

通过最基本的网络搜索或查看 rxJS 文档来查找相关信息将是非常不，或者对于 Angular 特定的用法，Angular 文档，以及其他地方。

【参考方案1】：

.subscribe() 函数类似于jQuery 中的Promise.then()、.catch() 和.finally() 方法，但它不是处理promises，而是处理Observables。

这意味着它将自己订阅感兴趣的observable（在您的情况下是getTasks()）并等到它是successful，然后执行第一个传递的回调函数，在您的情况下是：

tasks => 
    console.log(tasks);
 

如果您希望它在错误（类似于.catch()）或完成时（类似于.finally()）运行一些逻辑，您可以将该逻辑传递给subscribe，如下所示：

observable.subscribe(
  value => somethingToDoOnlyOnSuccess(value),
  error => somethingToDoOnlyOnError(error),
  () => somethingToDoAlways()
);

更多示例和详细信息可以找到here

【讨论】：

所以可以这样写吗：this.taskService.getTask(function()console.log(tasks);) // 另外我想了解我们为什么要使用任务=> 而不仅仅是 console.log(tasks)

是的，可以使用function 表示法，但使用arrow 表示法（=>）的优点是它保留了this 的含义，请参阅此@ 987654324@

我不会说“.subscribe()函数类似于.then()”因为这两个方法的签名：susbcribe(next, error, complete)参数分别与Promise.then()、@987654348相关@ 和 .finally() 方法

@imrok，感谢您的反馈。为了简单起见，前面使用了这个类比，但你完全正确，我用更准确的信息更新了答案。

【参考方案2】：

subscribe 与 promise then 相比的主要优势 - 您可以多次使用 observer.next(data) 通知更改，并且您的订阅者将对每个更改做出反应。

new Observable(observer => observer.next(data));

因此，如果您对同一事件有多个侦听器 - 每次观察者生成新数据时，所有侦听器都会收到更改事件，并将调用 observer.next()。当您拥有可以频繁更改的数据并且您希望通过单一且可预测的流程通知您的听众时，它非常有用。

Promise then 允许您等待异步操作一次。