javascript - jQuery Deferred - 在运行时向 Deferred 合约添加回调

Question

我需要向 jQuery 的 .when() 监视的函数添加未知数量(仅在运行时已知)的 .pipe() 调用。这些调用将基于另一个异步操作的 ajax 调用。请参阅下面的代码以获得更清晰的解释:

$.when(
    $.ajax({ 
        async: true,        
        success: function (data, textStatus, jqXhr) {
            console.log('Level 1')

            for(var i = 0; i < data.length; i++)
                jqXhr.pipe(
                    $.ajax({  
                        data: data[i],                                                              
                        async: true,        
                        success: function (data, textStatus, jqXhr) {
                            console.log('Level 2');
                        },       
                    })
                );
        },       
    }),
    $.ajax({
        async: true,        
        success: function (data, textStatus, jqXhr) {
            console.log('Level 3');
        },       
    })
).done(function(){ console.log('All done!'); });

基本上Level 1和Level 3需要并行执行。 Level 2 全部基于 Level 1 的结果。和 Level 1 一样，所有 Level 2 和 Level 3 都需要在全部完成之前执行。

使用上面的代码不起作用，因为对 .pipe() 的调用不会影响 .when() 正在监视的内容。

是否可以使用 jQuery 的 Deferred 框架做我想做的事情？

感谢您的帮助。

注意:早些时候，我问了一个非常类似的问题，但我意识到情况比我在那里说明的情况要复杂得多，我不想与现有答案造成混淆。

Original question

Answer 1

事情并没有那么复杂。如果您想并行执行所有 2 级调用，只需在 .pipe 回调中调用 $.when 并返回该延迟对象:

$.when(
    $.ajax({        
        // ...      
    }).pipe(function(data) {
        // concise way to make the Ajax calls for each value
        var deferreds = $.map(data, function(value) {
            return $.ajax({data: value, /*...*/});
        });
        return $.when.apply($, deferreds);
    }),
    $.ajax({        
        // ...       
    })
).done(function(){ console.log('All done!'); });

如果您想顺序执行它们，请再次使用.pipe:

$.when(
    $.ajax({        
        // ...      
    }).pipe(function(data) {
        // A "dummy" resolved deferred object 
        var deferred = (new $.Deferred()).resolve();
        $.each(data, function(value) {
            deferred = deferred.pipe(function() {
                return $.ajax({data: value, /*...*/});
            });
        });
        return deferred;
    }),
    $.ajax({        
        // ...       
    })
).done(function(){ console.log('All done!'); });

<小时/>

我不得不说，您应该将 Ajax 调用的数量保持在最低限度。