Promise 的含義

Promise 是非同步程式設計的一種解決方案，比傳統的解決方案——回撥函式和事件——更合理和更強大。它由社群最早提出和實現，ES6將其寫進了語言標準，統一了用法，原生提供了Promise物件。

所謂Promise，簡單說就是一個容器，裡面儲存著某個未來才會結束的事件（通常是一個非同步操作）的結果。從語法上說，Promise 是一個物件，從它可以獲取非同步操作的訊息。Promise 提供統一的 API，各種非同步操作都可以用同樣的方法進行處理。

Promise物件有以下兩個特點:
（1）物件的狀態不受外界影響。Promise物件代表一個非同步操作，有三種狀態：Pending（進行中）、Resolved（已完成，又稱 Fulfilled）和Rejected（已失敗）。只有非同步操作的結果，可以決定當前是哪一種狀態，任何其他操作都無法改變這個狀態。這也是Promise這個名字的由來，它的英語意思就是“承諾”，表示其他手段無法改變。
（2）一旦狀態改變，就不會再變，任何時候都可以得到這個結果。Promise物件的狀態改變，只有兩種可能：從Pending變為Resolved和從Pending變為Rejected。只要這兩種情況發生，狀態就凝固了，不會再變了，會一直保持這個結果。如果改變已經發生了，你再對Promise物件添加回調函式，也會立即得到這個結果。這與事件（Event）完全不同，事件的特點是，如果你錯過了它，再去監聽，是得不到結果的。

Promise也有一些缺點。
首先，無法取消Promise，一旦新建它就會立即執行，無法中途取消。
其次，如果不設定回撥函式，Promise內部丟擲的錯誤，不會反應到外部。
第三，當處於Pending狀態時，無法得知目前進展到哪一個階段（剛剛開始還是即將完成）。

基本用法

ES6 規定，Promise物件是一個建構函式，用來生成Promise例項。

var promise = new Promise(function(resolve, reject) {
  // ... some code

  if (/* 非同步操作成功 */){
    resolve(value);
  } else
 
 {
    reject(error);
  }
});

Promise建構函式接受一個函式作為引數，該函式的兩個引數分別是resolve和reject。它們是兩個函式，由 JavaScript 引擎提供，不用自己部署。

resolve函式的作用是，將Promise物件的狀態從“未完成”變為“成功”（即從 Pending 變為 Resolved），在非同步操作成功時呼叫，並將非同步操作的結果，作為引數傳遞出去；
reject函式的作用是，將Promise物件的狀態從“未完成”變為“失敗”（即從 Pending 變為 Rejected），在非同步操作失敗時呼叫，並將非同步操作報出的錯誤，作為引數傳遞出去。

Promise例項生成以後，可以用then方法分別指定Resolved狀態和Reject狀態的回撥函式。

promise.then(function(value) {
  // success
}, function(error) {
  // failure
});

then方法可以接受兩個回撥函式作為引數。第一個回撥函式是Promise物件的狀態變為Resolved時呼叫，第二個回撥函式是Promise物件的狀態變為Rejected時呼叫。其中，第二個函式是可選的，不一定要提供。這兩個函式都接受Promise物件傳出的值作為引數。

function timeout(ms) {
  return new Promise((resolve, reject) => {
    setTimeout(resolve, ms, 'done');
  });
}

timeout(100).then((value) => {
  console.log(value);
});

上面程式碼中，timeout方法返回一個Promise例項，表示一段時間以後才會發生的結果。過了指定的時間（ms引數）以後，Promise例項的狀態變為Resolved，就會觸發then方法繫結的回撥函式。

Promise 新建後就會立即執行。

let promise = new Promise(function(resolve, reject) {
  console.log('Promise');
  resolve();
});

promise.then(function() {
  console.log('Resolved.');
});

console.log('Hi!');

// Promise
// Hi!
// Resolved

上面程式碼中，Promise 新建後立即執行，所以首先輸出的是Promise。然後，then方法指定的回撥函式，將在當前指令碼所有同步任務執行完才會執行，所以Resolved最後輸出。

Promise.prototype.then()

Promise 例項具有then方法，也就是說，then方法是定義在原型物件Promise.prototype上的。它的作用是為 Promise 例項新增狀態改變時的回撥函式。前面說過，then方法的第一個引數是Resolved狀態的回撥函式，第二個引數（可選）是Rejected狀態的回撥函式。

then方法返回的是一個新的Promise例項（注意，不是原來那個Promise例項）。因此可以採用鏈式寫法，即then方法後面再呼叫另一個then方法。

getJSON("/posts.json").then(function(json) {
  return json.post;
}).then(function(post) {
  // ...
});

上面的程式碼使用then方法，依次指定了兩個回撥函式。第一個回撥函式完成以後，會將返回結果作為引數，傳入第二個回撥函式。

Promise.prototype.catch()

Promise.prototype.catch方法是.then(null, rejection)的別名，用於指定發生錯誤時的回撥函式。

getJSON('/posts.json').then(function(posts) {
  // ...
}).catch(function(error) {
  // 處理 getJSON 和 前一個回撥函式執行時發生的錯誤
  console.log('發生錯誤！', error);
});

上面程式碼中，getJSON方法返回一個 Promise 物件，如果該物件狀態變為Resolved，則會呼叫then方法指定的回撥函式；如果非同步操作丟擲錯誤，狀態就會變為Rejected，就會呼叫catch方法指定的回撥函式，處理這個錯誤。另外，then方法指定的回撥函式，如果執行中丟擲錯誤，也會被catch方法捕獲。

Promise.all()

Promise.all方法用於將多個 Promise 例項，包裝成一個新的 Promise 例項。

var p = Promise.all([p1, p2, p3]);

上面程式碼中，Promise.all方法接受一個數組作為引數，p1、p2、p3都是 Promise 例項，如果不是，就會先呼叫下面講到的Promise.resolve方法，將引數轉為 Promise 例項，再進一步處理。（Promise.all方法的引數可以不是陣列，但必須具有 Iterator 介面，且返回的每個成員都是 Promise 例項。）
p的狀態由p1、p2、p3決定，分成兩種情況。
（1）只有p1、p2、p3的狀態都變成fulfilled，p的狀態才會變成fulfilled，此時p1、p2、p3的返回值組成一個數組，傳遞給p的回撥函式。
（2）只要p1、p2、p3之中有一個被rejected，p的狀態就變成rejected，此時第一個被reject的例項的返回值，會傳遞給p的回撥函式。

// 生成一個Promise物件的陣列
var promises = [2, 3, 5, 7, 11, 13].map(function (id) {
  return getJSON('/post/' + id + ".json");
});

Promise.all(promises).then(function (posts) {
  // ...
}).catch(function(reason){
  // ...
});

上面程式碼中，promises是包含6個 Promise 例項的陣列，只有這6個例項的狀態都變成fulfilled，或者其中有一個變為rejected，才會呼叫Promise.all方法後面的回撥函式。

Promise.race()

Promise.race方法同樣是將多個Promise例項，包裝成一個新的Promise例項。

var p = Promise.race([p1, p2, p3]);

上面程式碼中，只要p1、p2、p3之中有一個例項率先改變狀態，p的狀態就跟著改變。那個率先改變的 Promise 例項的返回值，就傳遞給p的回撥函式。
Promise.race方法的引數與Promise.all方法一樣，如果不是 Promise 例項，就會先呼叫下面講到的Promise.resolve方法，將引數轉為 Promise 例項，再進一步處理。
下面是一個例子，如果指定時間內沒有獲得結果，就將Promise的狀態變為reject，否則變為resolve。

const p = Promise.race([
  fetch('/resource-that-may-take-a-while'),
  new Promise(function (resolve, reject) {
    setTimeout(() => reject(new Error('request timeout')), 5000)
  })
]);
p.then(response => console.log(response));
p.catch(error => console.log(error));

上面程式碼中，如果5秒之內fetch方法無法返回結果，變數p的狀態就會變為rejected，從而觸發catch方法指定的回撥函式。