jQuery.when()Deferred和/或Promise数组的进度

Question

我正在使用jQuery .when()来包装一组promises,以便在所有promises都已解决后我可以执行一些操作.

$.when.apply($, requests).done(function () {
    console.log(arguments); //it is an array like object which can be looped
    var total = 0;
    $.each(arguments, function (i, data) {
        console.log(data); //data is the value returned by each of the ajax requests

        total += data[0]; //if the result of the ajax request is a int value then
    });

    console.log(total)
});

假设我希望在每个单独的承诺得到解决时得到通知,作为显示进度的一种方式.例如,如果requests有50个请求并且其中3个已经解决,我希望能够以6%显示进度条.有没有办法使用$.when它,以便它可以在不修改内部承诺及其进度事件的情况下返回整体进度？

Answer 1

$.when()没有为您做进度通知.注册每个单独承诺的进度通知,或者您可以$.when()通过首先在每个承诺上注册完成通知然后调用来制作自己的版本$.when().

$.whenWithProgress = function(arrayOfPromises, progessCallback) {
   var cntr = 0;
   for (var i = 0; i < arrayOfPromises.length; i++) {
       arrayOfPromises[i].done(function() {
           progressCallback(++cntr, arrayOfPromises.length);
       });
   }
   return jQuery.when.apply(jQuery, arrayOfPromises);
}

$.whenWithProgress(requests, function(cnt, total) {
    console.log("promise " + cnt + " of " + total + " finished");
}).then(function() {
    // done handler here
}, function() {
    // err handler here
});

我一直在考虑这个问题,有点你想要进度通知,jQuery承诺有进步机制,我们没有使用它.这意味着进度通知不像它们那样可扩展.

不幸的是,因为$.when()返回一个promise(不是延迟的)并且你不能使用.notify()promise来触发进度通知,所以上面的代码是最简单的方法.但是,为了使用.progress通知而不是自定义回调,可以这样做:

$.whenWithProgress = function(arrayOfPromises) {
   var cntr = 0, defer = $.Deferred();
   for (var i = 0; i < arrayOfPromises.length; i++) {
       arrayOfPromises[i].done(function() {
           defer.notify(++cntr, arrayOfPromises.length);
       });
   }
   // It is kind of an anti-pattern to use our own deferred and 
   // then just resolve it when the promise is resolved
   // But, we can only call .notify() on a defer so if we want to use that, 
   // we are forced to make our own deferred
   jQuery.when.apply(jQuery, arrayOfPromises).done(function() {
       defer.resolveWith(null, arguments);
   });
   return defer.promise();
}

$.whenWithProgress(requests).then(function() {
    // done handler here
}, function() {
    // err handler here
}, function(cnt, total) {
    // progress handler here
    console.log("promise " + cnt + " of " + total + " finished");
});

反对第二种实现的论点是,承诺标准的努力似乎正在逐渐取消以任何方式与承诺相关的进展(进展将有一个单独的机制).但是,它现在在jQuery中并且可能会持续很长时间(jQuery不遵循信函的承诺标准)所以它真的是你选择的方向.