javascript Promise.race是什么_它有什么实际用途？_技术教程

Promise.race返回首个settled的Promise结果，不取消其余Promise；典型用途是超时控制，需配合AbortController避免假成功；与all、any的区别在于race以首个settled为准，无论成功或失败。

Promise.race 是一个静态方法，它接收一个 Promise 实例数组，返回一个新的 Promise。这个新 Promise 的状态**由第一个 settle（即 resolve 或 reject）的成员决定**——谁先完成，就用谁的结果或错误。

Promise.race 常见误用：以为它“取消”其他 Promise

这是最常被误解的一点：Promise.race 不会中断、终止或取消其余未完成的 Promise。它们仍在后台运行，只是你不再“监听”它们的结果了。

比如 Promise.race([fetch('/api'), new Promise(r => setTimeout(r, 5000))]) 中，如果 fetch 在 5 秒后才返回，但超时 Promise 先 resolve，那 race 返回的 Promise 就已 fulfilled；可 fetch 请求依然在发、响应依然可能到达，只是你没处理它
真正要做请求取消，得用 AbortController 配合 fetch，而不是依赖 race
如果你发现 race 后还有副作用（如重复弹窗、多次调用回调），大概率是没清理掉其他 Promise 的后续逻辑

实际可用的典型场景：超时控制

这是 Promise.race 最稳定、最无副作用的用法。它不改变原始操作，只给它加一层“时间封顶”保障。

function timeout(ms, promise) {
  const controller = new AbortController();
  const timeoutId = setTimeout(() => controller.abort(), ms);
  
  return Promise.race([
    promise,
    new Promise((_, reject) => {
      controller.signal.addEventListener('abort', () => {
        clearTimeout(timeoutId);
        reject(new Error('Request timed out'));
      });
    })
  ]);
}

// 使用
timeout(3000, fetch('/data')).then(res => res.json()).catch(err => console.error(err));

注意：上面示例用了 AbortController 而不是简单的 new Promise(resolve => setTimeout(resolve, ms))，是为了避免“假成功”——比如超时 Promise resolve 了，但原 Promise 其实也完成了，只是你没拿到结果
若用纯 setTimeout 构造超时 Promise，要确保它只 reject，不能 resolve，否则可能掩盖真实错误
超时时间设太短（如 100ms）在弱网下容易误判；设太长（如 30s）又失去意义；建议结合业务接口历史 P95 延迟来定

Promise.race 和 Promise.all、Promise.any 的关键区别

别把 race 当成“并发执行多个请求并取最快一个”的万能工具。它的行为和用途边界很明确：

Promise.all：全部 resolve 才 resolve；任一 reject 就 reject —— 适合强一致性依赖
Promise.any：任一 resolve 就 resolve；全部 reject 才 reject —— 适合容错式多源查询（如查 CDN、主站、备用 API）
Promise.race：第一个 settle 就结束（无论 resolve 还是 reject）—— 所以它既可能返回成功结果，也可能直接抛出错误，使用时必须 .catch 或 try/catch
如果只想取“最快的成功结果”，别用 race，改用 Promise.any；race 的“快”不保成功，只保“先落地”