【前端】ES5 实现类似 ES6 中 Promise.all 的效果的若干种方法

ES5 + jQuery.when

var urlArr = ["/", "/user/login/"];
var ajaxArr = [];
for (var i = 0; i < urlArr.length; ++i) {
(function (url) {
console.log(url)
ajaxArr.push($.ajax(url));
})(urlArr[i])
}
$.when.apply(null, ajaxArr).then(function () {
console.log(arguments)
});

ES5 + jQuery

var urlArr = ['a.html','b.html','c.html','d.html','e.html','f.html'];
var resolveCount = 0;
var rejectCount = 0;
for (var i = 0; i < urlArr.length; ++i) {
$.get(urlArr[i])
.done(function(data, textStatus, jqXHR) {
console.log('=====done=======')
// do something
++resolveCount;
})
.fail(function(jqXHR, textStatus, errorThrown) {
console.log('=====fail=======')
// do something
++rejectCount;
})
.always(function() {
console.log('=====always=======')
console.log(arguments);
var doneCount = resolveCount + rejectCount;
console.log("doneCount:", doneCount);
if (doneCount === urlArr.length) {
console.log('all done!!!')
// do something
}
console.log('=====always end=======')

})
}

ES5 + Underscore

var urlArr = ['a.html', 'b.html', 'c.html'];

var allDone = function () {
console.log('all done');
// do something
}
var allDone = _.after(urlArr.length, allDone)

for (var i = 0; i < urlArr.length; ++i) {
$.get(urlArr[i]).done(function () {
console.log(urlArr[i], 'done');
// do something
}).fail(function () {
console.log(urlArr[i], 'fail');
// do something
}).always(function () {
allDone();
})
}

ES6 + Promise

var urlArr = [/*... ...*/];
var promiseArr = [];
for (let i = 0; i < urlArr.length; ++i) {
let p = new Promise(resolve => {
$.get(urlArr[i], res => {
// do something
resolve();
})
});
promiseArr.push(p);
}
Promise.all(promiseArr).then(() => {
// do something
})