Javascript—如何将两个API ajax调用中的数据传递给一个函数

我试图对第三方API端点进行两次单独的ajax调用，并在HighChart图上显示其数据。我试图将两个调用的数据传递到我的

drawHighcharts

函数中，以便显示数据

我在正确传递来自两个ajax调用的数据时遇到问题。我尝试在两次ajax调用中回调我的

drawHighcharts

函数。当console.logging两个数据时，我只看到第一个

stData

，但是

odData

返回未定义。我返回stData两次，我相信这是因为我调用了我的函数两次

将两个数据处理为一个函数的正确方法是什么

我的预期结果是能够在我的

drawHighCharts

功能中访问

odData和stData

function getStData() {
    $.ajax({
        type: "GET",
        url: stUrl,
        async: true,
        success: function (stData) {
            drawHighCharts(stData)

        },
        error: function (e) {
            // handle exception
            console.log("Error occured while reading resource file: ", e);
        }
    });
}

function getOdData() {
    $.ajax({
        type: "GET",
        url: odUrl,
        async: true,
        success: function (odData) {
            drawHighCharts(odData)
        },
        error: function (e) {
            // handle exception
            console.log("Error occured while reading resource file: ", e);
        }
    });
}

function drawHighCharts(stData, odData) {
    console.log(stData, "st")

    console.log(odData, "od")


}

---

您得到了未定义的

，

，因为在ajax调用中，您只传递了一个参数。在

getStData

中，您仅将

stData

传递到

drawHighCharts

，而对于

getOdData

您仅传递

odData

。在

drawHighCharts

函数中，两个参数中的一个（第二个）未定义，因为您只传递了一个参数，这是有道理的。相反，您可以将多个get请求包装在

Promise.all

中。这样，您的请求将被提出，当它们都完成时，承诺将得到解决，您可以在

中访问两个API结果，然后在
承诺之后访问
。所有
。见下文

function getStData() {
    $.ajax({
        type: "GET",
        url: stUrl,
        async: true,
        success: function (stData) {
            return stData

        },
        error: function (e) {
            // handle exception
            console.log("Error occured while reading resource file: ", e);
        }
    });
}

function getOdData() {
    $.ajax({
        type: "GET",
        url: odUrl,
        async: true,
        success: function (odData) {
            return odData
        },
        error: function (e) {
            // handle exception
            console.log("Error occured while reading resource file: ", e);
        }
    });
}

function drawHighCharts(stData, odData) {
    console.log(stData, "st")
    console.log(odData, "od")
}



Promise.all([
  getStData(),
  getOdData(),
]).then(([stData, odData]) => drawHighCharts(stData, odData))

与React中的
获取
请求相关，但是
承诺。所有
都可以与常规JS中的ajax一起使用。
您可以在
getStData（）的成功内部调用
getOdData（）
，并将stData传递给它。然后在
getOdData（）
的成功内部，您将可以访问stData和odData。现在，您可以使用stData和odData调用
drawHighCharts（）