es5如何实现promise_es5实现promise，多异步请求返回数据

最近研究es6的promise觉得非常好用，还有jquery的 $.Deferred()、node里面的Q模块，都研究了一遍，于是自己用es5写了一个类似的promise功能

首先模块代码

1 var Q ={};2 Q.deffer = function() {3 var fn ={};4 var resolve = null;5 var reject = null;6 var done = null;7 var promis ={8 then: function(resolved, rejected) {9 resolve = resolved || function() {};10 reject = rejected || function() {};11 returnpromis;12 },13 done: function(doned) {14 done = doned || function() {};15 returnpromis;16 }17 };18

19 fn.promise = function() {20 returnpromis;21 };22

23 fn.resolve = function(data) {24 setTimeout(function() {25 if(resolve) {26 resolve(data);27 }28 if(done) {29 done();30 }31 }, 0)32

33 };34

35 fn.reject = function(data) {36 setTimeout(function() {37 if(reject) {38 reject(data);39 }40 if(done) {41 done();42 }43 }, 0)44

45 };46

47 returnfn;48 }49

50 Q.all = function(list) {51 var fn ={};52 var resolve = null;53 var reject = null;54 var done = null;55 var resolveList =[];56 var rejectList =[];57 var promis ={58 then: function(resolved, rejected) {59 resolve = resolved || function() {};60 reject = rejected || function() {};61 returnpromis;62 },63 done: function(doned) {64 done = doned || function() {};65 returnpromis;66 }67 };68

69 var count = 0;70

71 for(var i = 0; i < list.length; i++) {72 try{73 list[i].then(function(data) {74 resolveList.push(data);75 if(resolveList.length ==list.length) {76 if(resolve) {77 resolve(resolveList);78 }79 }80 }, function(data) {81 rejectList.push(data);82 if(reject) {83 reject(data);84 }85 }).done(function() {86 count++;87 if(count >=list.length) {88 if(done) {89 done(resolveList,rejectList);90 }91 }92 });93 } catch(e) {94 if(done) {95 done(resolveList,rejectList,e);96 }97 }98

99 }100

101

102

103 returnpromis;104 };

使用例子1

function _delay(time) {

var def = Q.deffer();

if(time == 1) {

def.resolve({

"正确": "success"

});

} else {

def.reject({

"错误": "error"

});

}

return def.promise();

}

_delay(0).then(function(data) {

console.log("then");

console.log(data);

}, function(err) {

console.log(err);

}).done();

使用例子2

function request(){

var deferred = Q.deffer();

$.ajax({

type:"get",

url:"xxxxxxxxxxx",

success:function(data){

deferred.resolve(data);

},

error:function(error){

deferred.resolve(error);

}

});

return deferred.promise();

}

request().then(function(data){

console.log(data);

},function(err){

console.log(err);

}).done();

Q.all的用法，多个异步操作

function request(){

var deferred = Q.deffer();

$.ajax({

type:"get",

url:"xxxxx",

success:function(data){

deferred.resolve(data);

},

error:function(error){

deferred.resolve(error);

}

});

return deferred.promise();

}

var promiseArr = [];

promiseArr.push(request());

promiseArr.push(request());

Q.all(promiseArr).then(function(data){

console.log(data);

},function(er){

console.log(er);

}).done(function(resolve,reject,e){

console.log(‘done‘);

});