JavaScript中解决Axios异步数据传递后函数返回undefined问题

你的问题核心是Axios的异步特性加上调用function2时未传参导致的，所以拿到undefined。具体来说：

• Axios请求是异步执行的，function1发起请求后，代码会继续往下走，不会等待请求完成；
• 调用function3时，API请求大概率还没结束，globalVariable没被赋值，而且function3里调用function2()时没传参数，自然返回undefined。

修正方案：用Promise + async/await处理异步逻辑 #

不需要依赖全局变量，直接通过异步流程控制传递数据，代码更清晰可靠：

1. 修改function1，让它返回Promise #

把Axios请求的Promise返回出去，方便后续等待请求完成：

function function1() {
  // 注意method参数格式，需明确写'method: get'
  return axios({ method: 'get', url: '你的API地址' })
    .then(response => response.data); // 直接返回接口返回的数据
}

2. 保留function2的逻辑（可按需简化） #

function2只负责处理传入的数据，不再依赖全局变量：

function function2(data) {
  const local = data;
  // 这里可以添加你的数据处理逻辑
  return local;
}

3. 用async/await改造function3 #

让function3变成异步函数，等待function1的请求完成后再调用function2：

async function function3() {
  // 等待API请求完成，拿到返回数据
  const apiData = await function1();
  // 把数据传给function2处理
  const from_local = function2(apiData);
  console.log(from_local); // 现在就能拿到正确的接口数据了
}

// 调用function3执行逻辑
function3();

原写法的问题总结 #

• 异步操作不阻塞代码：function1里的Axios请求发送后，JavaScript会继续执行后续代码，不会等接口返回再执行then里的逻辑；
• 全局变量不可靠：就算延迟调用function3，依赖全局变量也容易出现竞态问题（比如多次调用function1导致变量被覆盖）；
• function3调用function2()未传参，function2的参数为undefined，所以返回undefined。

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