初探 Promise

前言

  最近學習 JavaScript 的 Promise ，在此把學習的過程做個紀錄。

內容

  範例如下

function promise() {
  return new Promise((resolve, reject) => {
    if (Math.random() > 0.5 ) 
    	resolve('成功');
    else
    	reject('失敗');
  });
}
//
promise()
  .then((success) => {
    console.log(success);
  }, (fail) => {
    console.log(fail);
  })
//
promise()
  .then(success => {
    console.log(success);
  })
  .catch(fail => {
    console.log(fail);
  });
//
promise()
  .then(success => {
    console.log(success);
    return promise();
  })
  .then(success => {
    console.log(success);
  })
  .catch(fail => {
    console.log(fail);
  });

先看到範例開頭的 promise()，裡面會用到 Promise() ，這是新標準新增的 Funciton ，也是這次的主角，引數是一個 Funciton ， Function 會有兩個引數，第一個引數是'resolve'，第二個引數是'reject'，這兩個引數的型態都是 Function ，範例在取亂數後如果大於 0.5 ，就喚起 resolve() ，否則就喚起 reject()，就著就是第一次實際使用 promise() ， promise() 可以喚起 then() 來執行 Promise 物件裡的 Function ，也就是有 resolve 與 reject 引數的 Function ，第一個範例會對 then()  傳入成功與失敗對應的 Funciton ， 成功對應 resolve()  ，失敗對應 reject() ，接著第二次實際使用的用法沒有傳入失敗的引述，反倒在 then() 結束後會再執行 catch() ，這個 catch() 會在then() 失敗時被喚起，如果同時傳入失敗的引數又使用 catch() 時，catch() 就不會被執行，最後看到第三個範例，在第一個成功時會再次喚起 promise() 一次，但要注意喚起前要加 return 來喚起，這樣就會變成第一次如果成功就會喚起第二次的 then () ，這裡要注意不論是第一次或第二次的 then() 失敗都會喚起  catch() ，如果無法用語法來理解喚起的原因沒關係，可以把這個用法當作是一種格式，只要記得成功與失敗時哪被執行即可。

參考資料

[ 卡斯伯的 Blog ] JavaScript Promise 全介紹