ajax 实现 promise,Promise.js 是 Promises 的轻量级 JavaScript 实现 - 文章教程

Promise.js 是 Promises 的轻量级 JavaScript 实现，Promises 提供了 callback-passing 的替代方案，异步函数返回一个 Promise 对象可附加到 callbacks 中。

使用 Promise 对象

Promise 提供一个替代的回调传递。异步函数返回一个承诺对象上回调可以连接。回调连接使用 .then(callback) 的方法。他们将被称为当 Promise 得到解决。

var p = asyncfoo(a, b, c);

p.then(function(error, result) {

if (error) return;

alert(result);

});

异步函数必须解决的 Promise，.done() 法当他们的任务完成了。这个调用回调的函数具有相同的参数，通过 .done()。

function asyncfoo() {

var p = new promise.Promise();  /* (1) create a Promise */

setTimeout(function() {

p.done(null, "O hai!");     /* (3) resolve it when ready */

}, 1000);

return p;                       /* (2) return it */

}

回调函数关键字

虽然任意数量的参数接受回调，推荐使用以下方式：callback(error, result)

error参数可以用来传递错误代码，例如 error != false 的情况下出错；result 参数是用来传递由异步任务产生的值。这允许回调是这样写的：

function callback(error, result) {

if (error) {

/* Deal with error case. */

...

return;

}

/* Deal with normal case. */

...

}

链接异步函数

有两种方式调用异步函数的链接。第一个是使回调承诺对象和.then()调用链。事实上.then()返回一个Promise ，是解决当回调解决承诺。

function late(n) {

var p = new promise.Promise();

setTimeout(function() {

p.done(null, n);

}, n);

return p;

}

late(100).then(

function(err, n) {

return late(n + 200);

}

).then(

function(err, n) {

return late(n + 300);

}

).then(

function(err, n) {

return late(n + 400);

}

).then(

function(err, n) {

alert(n);

}

);

另一种选择是使用promise.chain()。该函数希望每个返回一个承诺的异步函数的数组promise.chain()本身回报承诺的Promise。

promise.chain([f1, f2, f3, ...]);

function late(n) {

var p = new promise.Promise();

setTimeout(function() {

p.done(null, n);

}, n);

return p;

}

promise.chain([

function() {

return late(100);

},

function(err, n) {

return late(n + 200);

},

function(err, n) {

return late(n + 300);

},

function(err, n) {

return late(n + 400);

}

]).then(

function(err, n) {

alert(n);

}

);

衔接函数

promise.join([p1, p2, p3, ...]);

promise.join()期待一个Promise对象的数组，并返回一个Promise ，将得到解决，一旦所有的参数已经解决。该回调将通过一个数组，其中包含每个Promise传递的值，在相同的顺序中给出了承诺。

function late(n) {

var p = new promise.Promise();

setTimeout(function() {

p.done(null, n);

}, n);

return p;

}

promise.join([

late(400),

late(800)

]).then(

function(results) {

var res0 = results[0];

var res1 = results[1];

alert(res0[1] + " " + res1[1]);

}

);

AJAX功能包括

因为Ajax请求是异步JavaScript多少根，promise.js提供以下功能：

promise.get(url, data, headers)

promise.post(url, data, headers)

promise.put(url, data, headers)

promise.del(url, data, headers)

data (optional) : a {key: value} object or url-encoded string.

headers (optional) : a {key: value} object (e.g. {"Accept": "application/json"}).

使用举例

promise.get('/').then(function(error, text, xhr) {

if (error) {

alert('Error ' + xhr.status);

return;

}

alert('The page contains ' + text.length + ' character(s).');

});

你可以设置之后，反应迟钝的Ajax请求，应中止以毫秒为单位的时间。这是一个全局配置选项，默认情况下禁用。

/* Global configuration option */

promise.ajaxTimeout = 10000;

浏览器兼容

这个插件库在IE5.5+ 和 FF1.5+浏览器中测试通过，意味着可以完美的运行而无需考虑兼容性问题。

相关链接