javascript - 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() 也能正常工作仅与发出 Observable 的 Observable 一起正式工作。