[S03E01] RxJS & Promise

Kevin · 2017年10月11日14:18

分享RxJS 內如何處理 Promise 與 let operator 的用法

相關的討論可以在此討論

lala.lee · 2017年10月12日03:52

什麼是Promise (節錄MDN的說明加上一些自己的想法？！)

Promise物件代表一個將完成（或失敗）的一個非同步操作，所產生的值。它使你能夠繫結處理函示與一個非同步操作最終的成功值或失敗訊息。

一個 Promise 物件處於以下幾種狀態：
擱置（pending）：初始狀態，不是 fulfilled 與 rejected。
實現（fulfilled）：表示操作成功地完成。
拒絕（rejected）：表示操作失敗了。

promise利用resolve來標示成功時，使用then來繫結成功處理函式。
promise利用reject來標示錯誤時，使用catch來繫結錯誤處理函式。

所以使用async await搭配promise，可以消除需要寫callback handler的方式，你不需要用then去串成功處理函式，而是在沒有使用await的其他地方，去寫成功後要做的處理，然後用try…catch的語法，在catch的地方做錯誤這處理，程式碼的可讀性更高。

參考連結：

Ian · 2017年10月12日06:00

如果那個 Observable 只是後端來的單一比資料

async function execute() {
  await getData().forEach(v => console.log(v));
}
execute();

改成

async function execute() {
  let v = await getData().toPromise().then(v => v);
  console.log(v);
}
execute();

好像比較直覺一點，如果不知道 forEach 是回傳 Promise 的話

Kevin · 2017年10月12日06:15

通常是不會刻意轉換成 promise，因為會喪失 RxJS 的強大

如果真的要轉換成 promise 的話，寫法會是這樣

async function execute() {
  let v = await getData().toPromise();
  console.log(v);
}
execute();

如果使用 await async 的話，是不需要再接 then 了

Kevin · 2017年10月12日06:26

Jonny · 2017年10月14日01:41