switchMap() 如何解析 Promise？

Question

我正在学习 Angular 2 教程，我正在讨论路由器，特别是关于使用 Observable 从 URL 中提取参数的部分。它为此使用 Observables。

部分代码是这样的：

ngOnInit(): void {
        this.route.params
            .switchMap((params: Params) => this.heroService.getHero(+params['id']))
            .subscribe(hero => this.hero = hero);
    }

还有getHero() 方法：

getHero(id: number): Promise<Hero> {
        return this.getHeroes()
            .then(heroes => heroes.find(hero => hero.id === id));
    }

如您所见，getHero() 被强类型化以返回 Hero 类型的 Promise。它返回 then() 调用的结果，据我所知，这是一个 Promise。

所以switchMap() 收到了一个 Promise 回复。据我了解switchMap() 的功能，它会获取所提供的任何内容并从中生成一个新的 Observable。 subscribe() 然后获取 Observable 持有的值并将其分配给 this.hero。

这是我不明白的：hero 实例变量被强类型化以保存 Hero 对象。由于switchMap() 从getHero() 的返回值中创建了一个Observable，而getHero() 返回了一个Promise，那么在我看来，subscribe() 正在将Promise<Hero> 分配给this.hero。我不明白 Promise 是如何得到解决的，它的实际值是如何被提取并放入 hero 实例变量中的。

感谢任何对此有任何见解的人！

Answer 1

这是 RxJS 5 中没有很好记录的特性之一。所有希望从某个回调中接收 Observable 的操作符实际上都与 Observables、Promises、迭代器、数组......

看看这些：

1. http://reactivex.io/rxjs/class/es6/MiscJSDoc.js~ObservableInputDoc.html
2. http://reactivex.io/rxjs/class/es6/MiscJSDoc.js~SubscribableOrPromiseDoc.html

所以发生的情况是switchMap() 订阅了从getHero(...) 返回的Promise，就像它是一个 Observable 一样。

源码的核心部分在这里：

• 在switchMap - https://github.com/ReactiveX/rxjs/blob/master/src/operator/switchMap.ts#L108

• 在subscribeToResult - https://github.com/ReactiveX/rxjs/blob/master/src/util/subscribeToResult.ts#L42

此原则的一个非常常见的用法是将一组项目拆包成单独的排放物。例如：

Observable.of([1,2,3,4])
  .concatAll()
  .subscribe(console.log);

这将打印：

1
2
3
4

观看现场演示：https://jsbin.com/sevale/4/edit?js,console

即使根据手册 concatAll() 官方仅适用于发出 Observables 的 Observables，它仍然有效。