标签：操作 es5 块代码 cte class ted 异步操作 xxxxx request
最近研究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 return promis; 12 }, 13 done: function(doned) { 14 done = doned || function() {}; 15 return promis; 16 } 17 }; 18 19 fn.promise = function() { 20 return promis; 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 return fn; 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 return promis; 62 }, 63 done: function(doned) { 64 done = doned || function() {}; 65 return promis; 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 return promis; 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‘);
});
标签：操作 es5 块代码 cte class ted 异步操作 xxxxx request
原文地址：http://www.cnblogs.com/muamaker/p/7562714.html
