为什么我的async/await在forEach里不生效？问题解析。

你大概写过类似这样的代码：从接口拿一批 ID，循环请求详情，最后统一处理结果。逻辑清清楚楚，跑起来也没报错，唯独 `console.log(results)` 打印出来是个空数组。你盯着屏幕看了三分钟，最后把 `forEach` 换成 `for` 循环——它就好了。

这不是玄学，也不是浏览器的 bug。`forEach` 和 `async/await` 之间确实存在一道设计上的鸿沟，理解它之后，这类问题就再也不会困扰你了。

先看现象：一个「看起来没问题」的写法

const ids = [1, 2, 3];

async function fetchUser(id) {
  const res = await fetch(`/api/user/${id}`);
  return res.json();
}

const results = [];

ids.forEach(async (id) => {
  const user = await fetchUser(id);
  results.push(user);
});

console.log(results); // []

直觉告诉我们：`forEach` 里每一轮都 `await` 了，应该等所有请求结束再往下走。但事实是，`console.log` 在第一行代码之后几微秒就执行了，而三个请求可能还在路上。

为什么 forEach 不等待？从它的实现说起

我们可以把 `forEach` 的核心逻辑简化成这样（忽略稀疏数组等细节）：

Array.prototype.myForEach = function (callback) {
  for (let i = 0; i < this.length; i++) {
    callback(this[i], i, this); // 注意：返回值被直接丢弃
  }
};

关键就在最后一行。`forEach` 调用回调函数，然后完全无视它的返回值。而 `async` 函数被调用时，无论里面有多少 `await`，它都会立刻返回一个 Promise——函数体会在遇到第一个 `await` 时挂起，控制权交还调用方。

所以真实发生的是：

1. `forEach` 调用第一个 `async` 回调，回调在第一个 `await` 处挂起，返回一个 Promise；
2. `forEach` 看一眼这个 Promise，扔掉，继续下一轮；
3. 三轮全部「启动」完毕，`forEach` 同步返回；
4. 主线程继续往下走，执行 `console.log`；
5. 若干毫秒后，三个 Promise 陆续 resolve。

换句话说，`forEach` 是同步的，它没有能力去等待任何异步结果。这不是它「忘了」等待，而是它的职责清单里从来没有「等待」这一项。

三个容易被忽略的后果

除了「结果拿不到」，还有两个坑更深。

异常会被静默吞掉。 回调里 `throw` 出来的错误，会变成一个 rejected 的 Promise，而由于没人 `await` 也没人 `.catch()`，它就成了 unhandled rejection。浏览器里表现为控制台一行红字，Node 里在新版本中会直接让进程退出。

执行顺序不可控。 三个请求其实是并发发出的，`results.push` 的顺序取决于谁的响应先回来，而不是 ID 的顺序。如果后端有速率限制，这种「一次性全发出去」还可能直接触发限流。

同样的坑还有一整套。 `map`、`filter`、`some`、`every`、`reduce` 全都是同步方法，全都不等 Promise。其中 `filter` 最阴险：

// 永远返回原数组，因为每个回调返回的都是 Promise（真值）
const valid = list.filter(async (item) => await check(item));

这里 `filter` 拿到的判据是 `Promise` 对象，而 `Promise` 永远是真值，于是过滤逻辑整体失效，还不会有任何报错。

那正确的写法是什么？

看你想要串行还是并发。

需要按顺序依次执行（串行）：

for (const id of ids) {
  const user = await fetchUser(id);
  results.push(user);
}

`for...of` 是真正的循环语句，`await` 直接作用于外层函数，暂停的就是外层函数本身。需要索引就用 `ids.entries()` 解构。ESLint 的 `no-await-in-loop` 规则会对这种写法报警告，但它警告的是性能——循环里的 `await` 是串行的，如果你确实需要顺序保证，忽略这条规则完全合理。

可以并发，且希望拿到全部结果：

const results = await Promise.all(ids.map((id) => fetchUser(id)));

注意这里 `map` 依然是同步的，它返回的是 `Promise[]`，真正起作用的是外面那层 `await Promise.all`。而且 `map` 保证了返回数组的顺序和原数组一致，不受响应先后影响。

不希望一个失败拖垮全部，用 `Promise.allSettled`；需要限制并发数，用 `p-limit` 之类的库，或者手写一个简单的池子。

顺带一提：记得让工具帮你兜底

`for...of` + `await` 是很多人心里的默认答案，但团队协作时最好让 lint 把关。TypeScript 项目打开 `@typescript-eslint/no-misused-promises` 规则，它专门检查「把 async 函数传给了期望同步回调的位置」这种情况，`forEach`、`setTimeout`、事件监听器都覆盖在内。这类错误一旦写出来几乎必然出问题，交给工具比靠记忆可靠得多。

小结

`async/await` 是语法糖，它只能暂停直接包含它的那个 async 函数。`forEach` 是一个同步的数组遍历方法，它拿到回调返回的 Promise 后转身就丢，没有任何机制让它去等待。所以问题从来不是「`await` 不生效」，而是你把它放错了容器。

下次再遇到「循环里 `await` 没反应」，先问自己一句：这个循环本身是同步的吗？如果是，换成 `for...of` 或 `Promise.all` + `map`，问题就结束了。