调用getData返回空数组，控制台可展开但JS无法访问内部数据如何解决

这个问题是异步代码执行顺序导致的：

• getFetch是异步函数，返回Promise对象，你在循环中发起的请求不会立刻返回结果，then回调要等到网络请求完成后才会执行
• 原getData是同步函数，循环执行完成后会立刻返回空数组，此时所有请求还在处理中，没有数据被push到数组里
• 控制台能展开看到数据是因为浏览器打印引用类型时保存的是内存地址，你点击展开时才会读取该地址的当前值，此时请求已经完成，所以能看到数据，但是代码同步执行时访问的是请求完成前的空数组，所以访问失败

将getData改为异步函数，用Promise.all等待所有请求完成后再返回结果：

const getData = async (dataURLs) => {
  // 生成所有请求的Promise数组
  const requestList = dataURLs.map(url => getFetch(url));
  // 等待所有请求执行完成，拿到所有返回结果
  const returnData = await Promise.all(requestList);
  console.log(returnData[0]);
  return returnData;
};

修改后getData返回Promise对象，需要用await或者then接收返回结果：

1. await调用方式（必须在async函数内部使用）

async function handleBusiness() {
  const dataResult = await getData(['https://xxx.com/api1', 'https://xxx.com/api2']);
  // 此处可正常访问数组内的所有数据
  console.log(dataResult);
}

2. then调用方式

getData(['https://xxx.com/api1', 'https://xxx.com/api2']).then(dataResult => {
  // 此处可正常访问数组内的所有数据
  console.log(dataResult);
});

注：你原有的getFetch已经内置了错误捕获，单个请求失败不会抛出异常，所以Promise.all不会因为单个请求失败而中断，和你原有逻辑保持一致。

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