如何在全局作用域中访问函数内的本地JSON数据？

嘿，我看到你卡在异步数据访问的坑里了——这绝对是前端开发中最容易踩的坑之一，别慌，咱们一步步理清楚问题在哪，再给你几个靠谱的解决方案！

问题根源：异步操作的执行时机 #

你的http.get是异步操作，它会在后台发送请求，而不会阻塞后续代码的执行。所以当你执行console.log(number1, number2)的时候，API请求还没完成，airportNav函数甚至都还没被调用，自然拿到的只是初始的1.0和2.0。

另外还有个小细节：你写的return number1, number2其实没用——JavaScript的逗号运算符只会返回最后一个值，所以这个return实际上只返回了number2，这也是个需要修正的点。

解决方案1：把依赖数据的逻辑放到异步回调里 #

最直接的方式就是，所有需要用到depNav数据的代码，都放到请求完成的回调中：

http.get(`http://localhost:3000/${depairport}`)
  .then(data => {
    const airportData = airportNav(data);
    console.log(airportData.lat, airportData.lon); // 这里能拿到正确的数据！
    // 所有需要用lat、lon的业务逻辑都写在这里
  })
  .catch(err => console.log(err));

var airportNav = function calculateDepNav(depNav){
  // 直接返回一个对象，清晰传递数据，避免全局变量污染
  return {
    lat: depNav.lat,
    lon: depNav.lon
  };
}

解决方案2：用async/await让代码更像同步逻辑 #

如果你觉得回调嵌套看着麻烦，可以用async/await语法糖，让异步代码的写法更直观：

// 把代码包裹在async函数里
async function getAirportNavData() {
  try {
    // await会等待请求完成，再执行后面的代码
    const data = await http.get(`http://localhost:3000/${depairport}`);
    const airportData = airportNav(data);
    console.log(airportData.lat, airportData.lon);
    // 后续需要用数据的逻辑都在这里写
  } catch (err) {
    console.log(err);
  }
}

var airportNav = function calculateDepNav(depNav){
  return { lat: depNav.lat, lon: depNav.lon };
}

// 调用这个async函数
getAirportNavData();

解决方案3：用Promise保存结果，后续按需使用 #

如果一定要在其他地方访问数据，可以把请求的Promise对象保存下来，之后需要用的时候再通过then获取：

// 先保存请求的Promise
const airportDataPromise = http.get(`http://localhost:3000/${depairport}`)
  .then(data => airportNav(data))
  .catch(err => {
    console.log(err);
    throw err; // 把错误抛出去，方便后续处理
  });

var airportNav = function calculateDepNav(depNav){
  return { lat: depNav.lat, lon: depNav.lon };
}

// 之后任何需要用数据的地方，都可以这样写
airportDataPromise.then(airportData => {
  console.log(airportData.lat, airportData.lon);
  // 在这里处理数据
});

额外建议：尽量避免全局变量 #

你之前用全局变量number1、number2传递数据的方式，很容易引发变量污染、数据覆盖的问题。直接返回数据对象，在回调中处理，会让代码更清晰、更易维护哦！

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