Promise和Observable的映射

前言

1. promise解決了嵌套地獄的問題，Observable解決了promise只有一個結果，和不能夠取消的問題。
2. 使用的是rxjs6版本。
3. 這篇文章是方便使用Observable的API替換Promise的API。

正經常使用法

promise
.then(result => {})
.catch(error => {})
.finally(() => {});

observable.subscribe(
  result => {},
  error => {},
  ()=>{},  // finally
);

then

promise
.then(result => {})
.then(result => {})
.then(result => {})

import { concat } from 'rxjs';
concat(observable0,observable1,observable2).subscribe(
  result => {},
  error => {},
  ()=>{},  // finally
);

// promise
this.getOne().then(data => {
  // 這裏返回另一個Promise
  return this.getTwo(data);
}).then(data => {
  console.log(data);  // 這裏打印第二個Promise的值
  return this.getThree(data);
}).then(data => {
  console.log(data); // 這裏打印第三個Promise的值
});

// Observable
import { forkJoin, Observable,from,pipe } from 'rxjs';
import { retryWhen, map, mergeMap } from 'rxjs/operators';

from(this.getOne)
.pipe(
    mergeMap(oneData => {
        console.log(oneData)
        return from(this.getTwo)
    }),
    mergeMap(twoData => {
        console.log(twoData)
        return from(this.getThree)
    })
)
.subscribe(threeData => {
    console.log(threeData)
    ...
})

Promise.all

Promise.all([promise0, promise1]).then((result)=>{});

import { forkJoin } from 'rxjs';
forkJoin([observable0, observable1]).subscribe(result => {});

Promise.race

Promise.race([promise0, promise1]).then((result)=>{});

import { race } from 'rxjs/observable/race';
race([observable0, observable1]).subscribe(result => {});