Javascript 如何在一个函数中获得多个ajax响应

我不知道这是否可能，但我正在尝试获取多个ajax响应，并在另一个函数中访问它的值

我实际上得到了响应（每个响应两次），但我无法返回响应的单个值

函数firstResponse（）{
const response1=$.ajax({
网址：'https://cors-anywhere.herokuapp.com/http://api.icndb.com/jokes/random',
方法：“GET”，
contentType:'应用程序/json'，
});
响应1.完成（功能（响应1）{
测试（响应1）；
})
}
函数secondResponse（）{
const response2=$.ajax({
网址：'https://cors-anywhere.herokuapp.com/https://official-笑话api.appspot.com/random_笑话'，
方法：“GET”，
contentType:'应用程序/json'，
});
response2.done（函数（response2）{
测试（响应2）；
})
}
firstResponse（）；
第二反应（）；
功能测试（响应1、响应2）{
console.log（'响应1'，响应1）；
console.log（'Response 2'，response2'）；
}

---

实现这一点有多种方法。我个人会遵守

承诺

function firstResponse() {
  return $.ajax({
    url: 'https://cors-anywhere.herokuapp.com/http://api.icndb.com/jokes/random',
    method: 'GET',
    contentType: 'application/json'
  });
}

function secondResponse() {
  return $.ajax({
    url: 'https://cors-anywhere.herokuapp.com/https://official-joke-api.appspot.com/random_joke',
    method: 'GET',
    contentType: 'application/json'
  });
}

function test() {
  Promise.all([
    firstResponse(), 
    secondResponse()
  ]).then(result => {
    console.log(result);
  });
}

test();

---

在

test

函数中，调用

Promise.all

，它等待解析所有单个承诺，并按照调用时传递给它的承诺的顺序将结果输出为数组

Ajax调用是异步的，因此如果您想在一个函数中处理这两个结果，您必须自己做一个计数器，对于最简单的类型，类似这样的操作：

function firstResponse() {
  const response1 = $.ajax({
    url: 'https://cors-anywhere.herokuapp.com/http://api.icndb.com/jokes/random',
    method: 'GET',
    contentType: 'application/json',
  });

  response1.done(function(response1) {
    test("response1", response1);
  })
}

function secondResponse() {
  const response2 = $.ajax({
    url: 'https://cors-anywhere.herokuapp.com/https://official-joke-api.appspot.com/random_joke',
    method: 'GET',
    contentType: 'application/json',
  });

  response2.done(function(response2) {
    test("response2", response2);
  })
}

var responses = [];

firstResponse();
secondResponse();

function test(index, data) {
  responses[index] = data;
  if (Object.keys(responses).length === 2) processResponses();
}

function processResponses() {
  console.log(responses);
}

有多种更高级的方法来处理它，比如使用async/await或其他什么，但这应该可以让您的工作完成，而无需对现有代码进行太多修改

更新：对于异步/等待方式，这是我现在首选的做事方式：

(async () => {
  const response1 = await $.ajax({
    url: 'https://cors-anywhere.herokuapp.com/http://api.icndb.com/jokes/random',
    method: 'GET',
    contentType: 'application/json',
  });

  const response2 = await $.ajax({
    url: 'https://cors-anywhere.herokuapp.com/https://official-joke-api.appspot.com/random_joke',
    method: 'GET',
    contentType: 'application/json',
  });

  console.log(response1);
  console.log(response2);

})();

---

return new Promise（（resolve，reject）=>{$.ajax（{…}）}）

-或者，正如我所做的那样，

return$.ajax（{…}）

-因为jQuery.ajax返回一个承诺（各种各样的），甚至

return Promise.resolve（

删除早期jQuery promisesponse 2的一些怪癖总是

未定义的，由于对
test
的两个调用都不会通过第二个参数
response2
，如果您不希望它同步运行，您可以始终使用上面更粗糙的方法，我看不出有任何问题反对同步运行两个请求，只是在一个函数中处理两个请求，在这里，同步处理它们是很好的。
let urls = ['https://cors-anywhere.herokuapp.com/http://api.icndb.com/jokes/random',
    'https://cors-anywhere.herokuapp.com/https://official-joke-api.appspot.com/random_joke'];

let structure = {
    method: 'GET',
    contentType: 'application/json',
};

async function first() {
    try {
        const response = await $.ajax({
            url: urls[0],
            structure,
        });

        return response;
    } catch(error) {
        // Error
    }

}

async function second() {
    try {
        const response = await $.ajax({
            url: urls[1],
            structure,
        });

        return response;
    } catch(error) {
        // Error
    }
}

async function test() {
    let response = await ('s')
    return response
}

first()
    .then(() => second());