你可以在 jQuery 中嵌入 when.applys() 吗？

Question

我正在尝试将 2 个 $.when.apply() 与 $.ajax 和 $.getJSON 一起使用。我正在尝试将一个嵌入到另一个中，但它似乎不起作用。这是大纲：

var jxhr = [];
var kxhr = [];

$.when($.getJSON('stuff.js', function(cart){
    //Grab Stuff
})).then(function(){
       for(i<stuff)
       {
           jxhr.push($.getJSON(array[stuff])
       }

       $.when.apply($, jxhr).done(function()
       {
           for(i<array2)
           {
               kxhr.push($.getJSON(array2[morestuff]))

           }
           $.when.apply($, kxhr).done(function())
           {
               //Finish up here.
               //Not running.
           }
       });
}

我从代码中提取了一些语法错误，但结构应该在那里。问题是第二个 $.when.apply() 没有运行。这是限制吗？有没有更好的方法来构建不使用嵌入时间的代码？

Answer 1

这是一种更垂直的 Promise 链接方法。由于$.getJSON 本身返回promise，因此无需将第一个调用包装在$.when 中。请注意，在调用最终的done 之前，必须依次解析 2 个then's

$.getJSON(url, function(cart) {
   $('body').append('<p>First getJSON call made</p>');
}).then(function(){
  var jxhr = [];
   $('body').append('<p>Start first loop then</p>')
  for (var i = 0; i < 5; i++) {
    jxhr.push(getSomeData('Loop 1'))
  }      
  return  $.when.apply($, jxhr)
}).then(function(){
   var kxhr = [];
  $('body').append('<p>Start second loop then</p>')
   for (var i = 0; i < 5; i++) {
      kxhr.push(getSomeData('Loop2'))
    }
   return $.when.apply(null, kxhr)
}).done(function(){
   $('body').append('<p>DONE!</p>');

});


function getSomeData(loop) {
  return  $.getJSON(url, function(res) {
      $('body').append('<p>'+loop+' getJSON call made</p>');
  })
}

DEMO

UPDATED DEMO（使用嵌套数组数据输出稍微更真实的数据处理）