如何在AJAX请求外部获取GET请求的响应结果？

这个问题确实是前端异步编程里的经典痛点！你已经精准抓住了核心——AJAX的异步特性导致done()回调外的代码会先于回调执行，所以gasAve还没被赋值就被打印，自然是undefined。下面给你几种实用的解决方案，结合你的代码来实现：

方案1：用回调函数处理后续逻辑 #

把需要使用gasAve的代码封装成一个单独的函数，在done()回调里拿到值后直接调用这个函数，把值传进去：

let gasAve;
let settings = {
  "async": true,
  "crossDomain": true,
  "url": "https://data.colorado.gov/resource/xyh2-p9cg.json?%24select=avg(allgradesgasprice)&%24where=date%20between%20'2017-01-01T12%3A00%3A00'%20and%20'2017-12-31T11%3A59%3A59'",
  "method": "GET",
};

// 封装处理逻辑的函数
function processGasAverage(avgValue) {
  console.log(avgValue); // 这里就能拿到正确的2.429...
  // 所有需要用到gasAve的操作都放在这里
}

$.ajax(settings).done(function (response) {
  console.log(response);
  let [{"avg_allgradesgasprice":gasAve}] = response;
  processGasAverage(gasAve); // 调用回调处理值
});

方案2：使用async/await让代码“同步化” #

jQuery的$.ajax()本身返回的是一个Promise对象，所以我们可以用async/await语法来改写，让异步代码看起来像同步执行，更易读：

async function getGasAverage() {
  let settings = {
    "async": true,
    "crossDomain": true,
    "url": "https://data.colorado.gov/resource/xyh2-p9cg.json?%24select=avg(allgradesgasprice)&%24where=date%20between%20'2017-01-01T12%3A00%3A00'%20and%20'2017-12-31T11%3A59%3A59'",
    "method": "GET",
  };

  try {
    const response = await $.ajax(settings);
    let [{"avg_allgradesgasprice":gasAve}] = response;
    console.log(gasAve); // 这里能拿到正确值
    // 后续需要用gasAve的代码直接写在这里
    return gasAve;
  } catch (error) {
    console.error('请求出错:', error);
  }
}

// 调用async函数
getGasAverage().then(avg => {
  console.log('拿到的平均值:', avg);
});

为什么原来的写法不行？ #

再简单理一下执行顺序：

1. 声明gasAve和settings变量
2. 发起AJAX请求（此时浏览器会在后台处理请求，不阻塞后续代码）
3. 直接执行console.log(gasAve)，此时gasAve还没被赋值，所以是undefined
4. 等AJAX请求完成后，才会执行done()回调里的代码，给gasAve赋值并打印

所以核心思路就是：所有依赖异步请求结果的代码，都要放在异步回调内部，或者通过Promise/async/await的方式等待结果返回后再执行。

内容的提问来源于stack exchange，提问作者anthonyCarton