当所有 json 数据都通过循环时如何运行 then()

Question

在我的代码中，我处理了多个 JSON 需要按顺序解析的请求。

let allRadio_data, allHistory_data, iTunes_data;


$.when(parseRadioList())
  .then(function(list) {
    radioList_data = list;

    return $.when(
    parseEachRadioData(radioList_data), 
    ParseEachHistoryData(radioList_data)
    );

  })
  .then(function() {
    console.log(allRadio_data);
    console.log(allHistory_data);

    return $.when(_parseiTunes());
  })
  .then(function(iTunesInfo) {
    iTunes_data = iTunesInfo;

    return _cacheOptions();
  })

function _cacheOptions() {
  // FINAL function
}


/////////
function parseRadioList() {
  return $.getJSON("https://api.myjson.com/bins/xiyvr");
}

function _parseiTunes() {
  return $.getJSON("https://itunes.apple.com/search?term=jackson&limit=10&callback=?")
}

function parseEachRadioData(radioList) {
  allRadio_data = [];
  $.each(radioList, function(index, radio) {
    $.when($.getJSON(radio.url + "/stats?sid=" + radio.stream_id + "&json=1&callback=?"))
      .then(function(data) {
        allRadio_data.push(data);
      });
  })
}

function ParseEachHistoryData(radioList) {
  allHistory_data = [];
  $.each(radioList, function(index, radio) {
    $.when($.getJSON(radio.url + "/played?sid=" + radio.stream_id + "&type=json&callback=?"))
      .then(function(data) {
        allHistory_data.push(data);
      });
  })
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

现在代码是运行，但我 console.log(allRadio_data); 它是空的。但是，如果我 settimeout() 延迟一秒钟，数据就完成了。这意味着 then() 没有准时运行。

这就是我要找的结构：

JSON 文件 1 已解析。 parseRadioList()
JSON1 是 JSON URLS 的多个条目的数组。
运行通过 JSON1 数组中的 URL，并对每个 URL 执行 getJSON。 parseEachRadioData(radioList_data) & ParseEachHistoryData(radioList_data)
将每个 JSON 的数据推送到一个通用数组中。
完成后，解析 JSON2 _parseiTunes()

想知道如何使此代码运行具有正确的结构。

提前致谢。

Answer 1

首先，parseEachRadioData 和 ParseEachHistoryData 根本 return 什么都没有，更不用说 Promise - 所以不可能等待它们

此外，你过度使用了 $.when ... 事实上你永远不需要使用它，只需使用常规承诺，因为 jQuery $.getJSON 等 return 一个可用的 Promise-like对象

即你的代码可以是

let allRadio_data, allHistory_data, iTunes_data;


parseRadioList()
.then(function(list) {
    radioList_data = list;
    return Promise.all([
        parseEachRadioData(radioList_data), 
        ParseEachHistoryData(radioList_data)
    ]);

})
.then(function(result) {
    allRadio_data = result[0];
    allHistory_data = result[1];
    console.log(allRadio_data);
    console.log(allHistory_data);
    return _parseiTunes();
})
.then(function(iTunesInfo) {
    iTunes_data = iTunesInfo;
    return _cacheOptions();
})

function _cacheOptions() {
  // FINAL function
}


/////////
function parseRadioList() {
    return $.getJSON("https://api.myjson.com/bins/xiyvr");
}

function _parseiTunes() {
    return $.getJSON("https://itunes.apple.com/search?term=jackson&limit=10&callback=?")
}

function parseEachRadioData(radioList) {
    return Promise.all(radioList.map(radio => $.getJSON(radio.url + "/stats?sid=" + radio.stream_id + "&json=1&callback=?")));
}

function ParseEachHistoryData(radioList) {
    return Promise.all(radioList.map(radio => $.getJSON(radio.url + "/played?sid=" + radio.stream_id + "&type=json&callback=?")));
}

Answer 2

初看

$.when(parseRadioList())  // your code will wait her
  .then(function (list) {
    radioList_data = list;

    return $.when(
      parseEachRadioData(radioList_data), //  this two method are void they will complete 
      ParseEachHistoryData(radioList_data)  // immediately without waithing for getJson...
    );

  })

当所有 json 数据都通过循环时如何运行 then()

How to run then() when all json data gone through the loop

javascript

jquery

json

getjson

promise

当所有 json 数据都通过循环时如何 运行 then()

How to run then() when all json data gone through the loop

javascript

jquery

json

getjson

promise

当所有 json 数据都通过循环时如何运行 then()