JavaScript Promise 并发：Promise.all 与 Promise.race 的应用

betcha 2025-11-11 00:00:00 次阅读

Promise.all需所有异步操作成功才返回结果，适用于必须全部完成的场景；Promise.race以首个完成者为准，适合超时控制或取最快响应。

在处理多个异步操作时，JavaScript 提供了 Promise.all 和 Promise.race 两种方式来管理并发请求。它们都接收一个 Promise 数组作为参数，但行为不同，适用于不同场景。

Promise.all：等待所有任务完成

Promise.all 接收一组 Promise，并返回一个新的 Promise。这个新 Promise 在所有输入的 Promise 都成功 resolve 后才会 resolve，返回值是所有结果组成的数组。只要有一个 Promise 被 reject，整个 Promise.all 就会立即 reject。

适合场景：需要所有数据都获取成功才能继续执行，比如同时拉取用户信息、订单列表和配置项。

示例：

const fetchUser = fetch('/api/user').then(res => res.json());
const fetchOrders = fetch('/api/orders').then(res => res.json());
const fetchConfig = fetch('/api/config').then(res => res.json());

Promise.all([fetchUser, fetchOrders, fetchConfig])
  .then(([user, orders, config]) => {
    console.log('用户:', user);
    console.log('订单:', orders);
    console.log('配置:', config);
  })
  .catch(err => {
    console.error('任一请求失败:', err);
  });

注意：如果其中一个请求出错，其他仍在进行的请求不会被取消（JS 中无内置取消机制），但整体结果会失败。

Promise.race：响应最快者胜出

Promise.race 同样接收一个 Promise 数组，但它只关心第一个完成的结果（resolve 或 reject）。一旦有一个 Promise 落定，race 的结果就立刻确定。

适合场景：超时控制、资源多源加载（如从多个镜像地址取数据，用最快的）。

示例：实现请求超时

const fetchWithTimeout = (url, timeout) => {
  const fetchPromise = fetch(url);
  const timeoutPromise = new Promise((_, reject) => {
    setTimeout(() => reject(new Error('请求超时')), timeout);
  });

  return Promise.race([fetchPromise, timeoutPromise]);
};

fetchWithTimeout('/api/data', 5000)
  .then(res => res.json())
  .then(data => console.log('数据:', data))
  .catch(err => console.error('错误:', err.message));