Promise 編程模式也被稱為thenable，可以理解為延遲後執行。每個Promise 都擁有一個叫做then 的唯一接口，當Promise 失敗或成功時，它就會進行回調。它代表了一種可能會長時間運行而且不一定必須完成的操作結果。這種模式不會阻塞和等待長時間的操作完成，而是返回一個代表了承諾的（promised）結果的對象。
當前的許多JavaScript 庫（如jQuery 和Dojo、AngularJS）均添加了這種稱為Promise 的抽象。通過這些庫，開發人員能夠在實際編程中使用Promise 模式。
下面我們將以jQuery 為例討論JavaScript 庫是如何使用Promise 模式的來處理異步的，其實就是通過回調的方式提供容錯支持。在某個操作成功或失敗或任何情況下都執行對應的回調，盡量把某段邏輯可能出現的情況都handle 住。
首先讓我們來看看jQuery 一般是如何操作的：
複製代碼代碼如下:
var $info = $("#info");
$.ajax({
url:"/echo/json/",
data: { json: JSON.stringify({"name": "someValue"}) },
type:"POST",
success: function(response)
{
$info.text(response.name);
}
});
在這個例子中，你可以看到當設置成功後會指定一個回調，是一種很好的回調方式，這並不是Promise，jQuery 官方文檔也不再推薦這種方式（http://api.jquery.com/jQuery.ajax/#jqXHR）。 當Ajax 調用完成後，它便會執行success 函數。根據庫所使用的異步操作，你可以使用各種不同的回調（即任務是否成功，都會進行回調，做出響應）。使用Promise 模式會簡化這個過程，異步操作只需返回一個對象調用。這個Promise 允許你調用一個叫做then 的方法，然後讓你指定回調的function(s) 個數。
下面讓我們來看看jQuery 是如何建立Promise 的：
複製代碼代碼如下:
var $info = $("#info");
$.ajax({
url: "/echo/json/",
data: {
json: JSON.stringify({
"name": "someValue"
})
},
type: "POST"
})
.then(function (response) {
$info.text(response.name);
});
jQuery ajax 對象通過返回xhr 對象實現Promise 模式，所以我們可以調用then 方法，這樣做的優勢是你可以鍊式調用，實現獨立操作，如下所示：
複製代碼代碼如下:
var $info = $("#info");
$.ajax({
url: "/echo/json/",
data: {
json: JSON.stringify({
"name": "someValue"
})
},
type: "POST"
})
.then(function (response) {
$info.text(response.name);
})
.then(function () {
$info.append("...More");
})
.done(function () {
$info.append("...finally!");
});
由於許多庫都開始採用Promise 模式，所以異步操作會變的非常容易。但如果站在相反的角度思考，Promise 將會是什麼樣子的呢？其中一個非常重要的模式是函數可以接受兩種功能，一個是成功時的回調，另一個是失敗時的回調。
複製代碼代碼如下:
var $info = $("#info");
$.ajax({
// Change URL to see error happen
url: "/echo/json/",
data: {
json: JSON.stringify({
"name": "someValue"
})
},
type: "POST"
})
.then(function (response) {
// success
$info.text(response.name);
},
function () {
// failure
$info.text("bad things happen to good developers");
})
.always(function () {
$info.append("...finally");
});
需要注意的是，在jQuery 裡，無論成功還是失敗，我們都會使用一個調用來指定我們想要調用的。
其實這裡也可以這樣來寫，這也是jQuery 官方文檔裡推薦的方法：
複製代碼代碼如下:
var $info = $("#info");
$.ajax({
// Change URL to see error happen
url: "/echo/json/",
data: {
json: JSON.stringify({
"name": "someValue"
})
},
type: "POST"
})
.done(function (response) {
// success
$info.text(response.name);
}).fail(function () {
// failure
$info.text("bad things happen to good developers");
})
.always(function () {
$info.append("...finally");
});
下面再來看看AngularJS 是如何使用Promise 模式的：
複製代碼代碼如下:
var m = angular.module("myApp", []);
m.factory("dataService", function ($q) {
function _callMe() {
var d = $q.defer();
setTimeout(function () {
d.resolve();
//defer.reject();
}, 100);
return d.promise;
}
return {
callMe: _callMe
};
});
function myCtrl($scope, dataService) {
$scope.name = "None";
$scope.isBusy = true;
dataService.callMe()
.then(function () {
// Successful
$scope.name = "success";
},
function () {
// failure
$scope.name = "failure";
})
.then(function () {
// Like a Finally Clause
$scope.isBusy = false;
});
}
你可以在JSFiddle 裡試試這些例子，並且看看會產生哪些效果。使用Promise 來操作異步是一種非常簡單的方式，而且還可以簡化你的代碼，確實是一舉兩得的好方法。
更多關於Promise的介紹及示例，可以前往官網（http://www.promisejs.org/）查看。