为什么我们应该使用 RxJs of() 函数？

Question

在 angular2 angular.io 教程的服务部分，我点击了一个名为 of.for 示例的方法：

getHeroes(): Observable<Hero[]> {
  return of(HEROES);
}

或在下面的示例中：

getHero(id: number): Observable<Hero> {
  // Todo: send the message _after_ fetching the hero
  this.messageService.add(`HeroService: fetched hero id=${id}`);
  return of(HEROES.find(hero => hero.id === id));
}

在angular.io刚刚解释过

used RxJS of() to return an Observable of mock heroes (Observable<Hero[]>).

并且没有解释为什么我们应该使用 of 运算符，它到底做了什么，它有什么好处？

Answer 1

在第一个例子中，我假设HEROES变量是一个对象数组，其中每个对象对应接口Hero（或者是class的实例Hero).当我们在代码的某处调用这个函数时，它会像这样：

heroService.getHeroes()
  .subscribe((heroes: Hero[]) => {
    console.log(heroes) 
    // will output array of heroes: [{...}, {...}, ...]
  })

意思是，当我们一个一个地使用Observable's of creation method with array as argument, on subscription it will emit the whole array, not its'个元素时

在第二个例子中，当我们订阅从getHero()方法返回的Observable时，它只发出一个英雄，其id对应给定的id。

基本上，当您使用 of 方法创建 Observable 并为其提供参数时，在订阅时它会逐一发出这些参数

Here's a good reference

Answer 2

Observable.of() 对于在实现异步交互（例如，对 API 的 http 请求）之前维护 Observable 数据类型很有用。

正如 Brandon Miller 所暗示的，Observable.of() returns 一个 Observable 会立即发出作为参数提供给 of() 的任何值，然后完成。

这比返回静态值更好，因为它允许您编写可以处理 Observable 类型（同步和异步工作）的订阅者，甚至在实现异步过程之前。

//this function works synchronously AND asynchronously
getHeroes(): Observable<Hero[]> { 
  return Observable.of(HEROES)
  //-OR-
  return this.http.get('my.api.com/heroes')
  .map(res => res.json());
}

//it can be subscribed to in both cases
getHeroes().subscribe(heroes => {
  console.log(heroes); // '[hero1,hero2,hero3...]'
}

//DON'T DO THIS
getHeroesBad(): Array<Hero> {
  return HEROES                             //Works synchronously
  //-OR-
  return this.http.get('my.api.com/heroes') //TypeError, requires refactor
}

Answer 3

他们使用 of() 的原因是因为它比真正的 HTTP 调用更容易使用。

在实际应用程序中，您可以像这样实现 getHeroes()，例如：

getHeroes(): Observable<Hero[]> {
  return this.http.get(`/heroes`);
}

但是由于您只想使用模拟响应而不创建任何真实后端，您可以使用 of() 到 return 假响应：

const HEROES = [{...}, {...}];

getHeroes(): Observable<Hero[]> {
  return of(HEROES);
}

您的应用程序的其余部分将以相同的方式工作，因为 of() 是一个 Observable，您稍后可以像使用 this.http.get(...).[=19= 一样订阅或链接操作符。 ]

of() 做的唯一一件事是它在订阅时立即将其参数作为单次发射发出，然后发送 complete 通知。

为什么我们应该使用 RxJs of() 函数？

Why we should use RxJs of() function?

javascript

service

rxjs

angular2-services

angular