Javascript 如何在一个主函数中使用两个getJSON调用？

我当前的

…

选项卡具有以下流程：

<script>

$(document).ready(function(){
    function main(){

        var urlOne = 'https:....';
        var summaryTable = {};
        var distinctKeys = [];
        $.getJSON(urlOne, function(jsonOne) {
            // write code to collect data from urlOne and put it in 'summaryTable' AND 'distinctKeys'
            distinctKeys.append(jsonOne['something']);
        }); // end of first getJSON

        /* ****** the javascript would NOT execute anything below this **** */
        var foo = distinctKeys.length;
        for (var i = 0; i < foo; i++) {

            var curUrl = urlConstant + distinctKeys[i];
            $.getJSON(curUrl, function(jsonTwo) {
                // do stuff to add more info into 'summaryTable'
            }); // end of second getJSON

        }; // end of for loop

    }; // end of main()
    main();
}); // end of all javascript code    
</script>

$（文档）.ready（函数（）{
函数main（）{
var urlOne='https:..'；
var summaryTable={}；
var distinctKeys=[]；
$.getJSON（urlOne，函数（jsonOne）{
//编写代码从urlOne收集数据并将其放入“summaryTable”和“distinctKeys”
append（jsonOne['something']）；
})；//第一个getJSON的结尾
/********javascript不会执行低于此****的任何内容*/
var foo=distinctKeys.length；
对于（变量i=0；i

正如我前面提到的，代码不会继续执行

/*******行下面的任何内容，javascript不会执行该******/

行下面的任何内容。我注意到，执行第一个

$.getJSON

调用后，

distinctKeys

和

summaryTable

仍然是空的。我想按特定顺序调用

getJSON

两次——第二次是基于从第一次调用中获得/收集的信息。有人能解释一下我是如何做到的吗

---

提前感谢您的回答

给你一个解决方案

var urlArray = ['https://one.com', 'https://two.com', 'https://three.com'];
var i = 0;

var getJSONData = function(){
  $.getJSON(urlArray[i], function(data){
    console.log(data);   

    i++;
    if( i < urlArray.length)
      getJSONData();
  });

};

希望这对你有帮助

Javascript中的异步函数不会阻止代码 执行。它允许程序流继续执行下一个语句 不立即执行功能块内部的内容。什么时候 它有一些响应，异步调用中的函数得到 执行。因此名为

回调

函数

在您的例子中，

function（jsonOne）{

是一个回调函数，在从服务器获得响应后执行get

上述陈述的一个小例子：

var data = [];
$.getJSON('https://adobe.github.io/Spry/data/json/array-01.js', function(data) {
    console.log("JSON output length is", data.length);
});
console.log("JSON output length is", data.length);

执行此操作将首先记录

JSON输出长度为0

，然后记录

JSON输出长度为5

。这解释了Javascript如何处理异步调用

还要注意，我们在回调外部访问的数据变量与在回调内部访问的数据变量不同。回调内部的变量数据只能在回调内部访问，因为在Javascript中，变量具有函数作用域。它们的作用域仅限于声明它们的函数

---

下一个问题是使用for循环调用异步函数。到目前为止，您应该很清楚，for循环将在您获得第一个getJSON调用的响应之前完成执行

因此，如果您计划在响应回调中使用i的值， 对于所有getJSON，您将始终获得终止值i 响应回调

示例代码：

for (var i=0; i<5; i++) {
    $.getJSON('https://adobe.github.io/Spry/data/json/array-01.js', function(jsonData) {
        console.log("Iteration number", i);
    });
}

这利用了javascript中的

立即调用的匿名函数

。基本上，在循环中，您调用函数而不是直接调用getJSON。对于此函数，您将i作为参数传递。在函数中，i可以作为x访问。在函数中，调用函数时i的值保留为x

对于Javascript专家忍者，我更喜欢匿名函数，因为 我不想通过为声明函数而污染全局命名空间 这是一项不重复的任务。我知道效率会受到影响，但它 对于少量的i应该是可以的

---

@user1330974:这可能不是您期望的直接答案，但一旦您理解了这个概念，您将能够自己解决问题。

javascript将不会执行低于此值的任何操作

为什么不？您是否在开发人员工具控制台中收到错误？-例如，

var urlArray=['https://one.com', 'https://two.com', 'https://three.com]；

有一个语法错误哦，

第二次是基于从第一次调用中获得/收集的信息

但是在盲目地进行第二次和第三次调用之前，你不会等待第一次调用开始（更不用说完成了）…AJAX是异步的（这就是AJAX中第一个A的含义）谢谢你的建议。我已经更新了我的问题以提供更多的上下文。我想我很难弄清楚如何让第二个

getJSON

在

for

循环下执行。鉴于更新的代码结构，你有没有其他建议来摆脱这种混乱？你在ide for循环并将i inside的值作为参数传递。谢谢！我将阅读您共享的链接。现在，我需要睡觉了（在这个问题上停留太久了，我越来越累了…。我已经更新了问题。我想我遇到的问题是如何1）使用第一个

getJSON

调用填充两个变量

summaryTable

和

distinctKeys

，然后2）使用上一步的信息调用第二个

getJSON

。但是就像你说的，

getJSON

是异步的，那么我怎么可能绕过这个问题呢？谢谢！@user1330974让我更新根据您最新的问题回答谢谢！我要睡觉了（我已经过了午夜），但我"我将仔细阅读您建议的解决方案，并在7-8小时后回复您。@user1330974我已更新了答案。在您的最新方案中，您的第二个

AJAX

调用应该从第一个

AJAX调用成功

方法触发，这将确保您的

distinctKeys

变量具有值。@user1330974欢迎好友：）

for (var i=0; i<5; i++) {
    $.getJSON('https://adobe.github.io/Spry/data/json/array-01.js', function(jsonData) {
        console.log("Iteration number", i);
    });
}

for (var i=0; i<5; i++) {
    (function(x) {
        $.getJSON('https://adobe.github.io/Spry/data/json/array-01.js', function(jsonData) {
            console.log("Iteration number", x);
        });
    )(i);
}