• 级联调用
    • 依赖调用
      • Promise 方式
      • RxJS 方式
    • 半依赖
      • Promise 方式
      • RxJS 方式
    • 陷阱

    级联调用

    级联调用意味着调用A执行后,调用B会基于A执行,调用C又会基于调用B执行,以此类推。

    依赖调用

    依赖调用意味着调用需要按顺序执行。调用2必须在调用1返回后执行。甚至可能调用2需要使用调用1返回的数据。

    想象下以下场景:

    • 用户需要先登录
    • 然后可以获取用户详情
    • 再然后可以获取用户订单

    Promise 方式

    1. login()
    2. .then(getUserDetails)
    3. .then(getOrdersByUser)

    RxJS 方式

    1. let stream$ = Rx.Observable.of({ message : 'Logged in' })
    2. .switchMap( result => {
    3. return Rx.Observable.of({ id: 1, name : 'user' })
    4. })
    5. .switchMap((user) => {
    6. return Rx.Observable.from(
    7. [ { id: 114, userId : 1 },
    8. { id: 117, userId : 1 } ])
    9. })
    10. stream$.subscribe((orders) => {
    11. console.log('Orders', orders);
    12. })
    13. // 订单数组

    在 RxJS 示例中我简化了很多东西,但想象下如果替换了

    1. Rx.Observable.of()

    执行适当的 ajax() 调用,就像在操作符和 Ajax一章中所做的。

    半依赖

    • 可以获取用户详情
    • 然后并行地获取订单和消息

    Promise 方式

    1. getUser()
    2. .then((user) => {
    3. return Promise.all(
    4. getOrders(),
    5. getMessages()
    6. )
    7. })

    RxJS 方式

    1. let stream$ = Rx.Observable.of({ id : 1, name : 'User' })
    2. stream.switchMap((user) => {
    3. return Rx.Observable.forkJoin(
    4. Rx.Observable.from([{ id : 114, user: 1}, { id : 115, user: 1}]),
    5. Rx.Observable.from([{ id : 200, user: 1}, { id : 201, user: 1}])
    6. )
    7. })
    8. stream$.subscribe((result) => {
    9. console.log('Orders', result[0]);
    10. console.log('Messages', result[1]);
    11. })

    陷阱

    我们用 switchMap() 替代了 flatMap(),所以如果需要的话我们可以取消 ajax 调用,这在菜谱 - auto complete 中更有实际意义。