async/await使用错误致主线程不等待，机票采集结果返回undefined

核心问题 #

你调用异步的searchFlight时，没有正确等待它完成就执行push操作，要么是没使用await，要么是在循环中错误处理了异步逻辑（比如forEach里用async函数但无法等待）。

正确实现方式 #

1. 使用async/await配合for循环（推荐） #

如果要遍历多个时间段采集价格，用普通for循环而非forEach——forEach无法等待内部的异步操作完成，会导致主线程提前推进。

const tickets = [];

// 模拟你的异步查询函数（替换为实际逻辑即可）
async function searchFlight(date) {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({ date, price: Math.floor(Math.random() * 1000) });
    }, 800);
  });
}

async function collectFlightPrices(dates) {
  // 逐个等待异步查询完成，确保拿到结果再push
  for (const date of dates) {
    const flightData = await searchFlight(date);
    tickets.push(flightData);
  }
  
  // 所有查询完成后处理结果，比如筛选最低价
  const cheapest = tickets.reduce((min, item) => item.price < min.price ? item : min, tickets[0]);
  console.log('最便宜的时段:', cheapest);
}

// 调用示例
const targetDates = ['2024-06-10', '2024-06-15', '2024-06-20'];
collectFlightPrices(targetDates);

2. 用Promise.all批量处理（提升效率） #

如果希望同时发起所有查询，而非逐个等待，可以用Promise.all批量处理异步任务：

async function collectFlightPrices(dates) {
  // 生成所有异步请求的Promise数组
  const flightPromises = dates.map(date => searchFlight(date));
  // 等待所有Promise完成，直接拿到完整结果数组
  const tickets = await Promise.all(flightPromises);
  
  // 筛选最低价
  const cheapest = tickets.reduce((min, item) => item.price < min.price ? item : min, tickets[0]);
  console.log('最便宜的时段:', cheapest);
}

常见错误排查 #

• 确保searchFlight是async函数或明确返回Promise。如果它没返回Promise，await会直接返回原值，但内部异步操作（比如API调用）的结果会拿不到。
• 不要在forEach里直接用await，这类方法不会等待异步任务完成，会导致主线程提前执行后续代码。
• 如果之前用then无效，大概率是没在then内部正确处理push，比如错误写法：

  // 错误：forEach里的then不会阻塞主线程，tickets此时为空或不完整
  dates.forEach(date => {
    searchFlight(date).then(res => tickets.push(res));
  });
  console.log(tickets); // 这里打印的是未完成的结果
  

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