JavaScript Promise.all 作用及用法详解

珍惜时间，勤奋学习！今天给大家带来《JavaScript Promise.all 作用及用法详解》，正文内容主要涉及到等等，如果你正在学习文章，或者是对文章有疑问，欢迎大家关注我！后面我会持续更新相关内容的，希望都能帮到正在学习的大家！

Promise.all并发执行所有Promise并等待全部完成，全部fulfilled时返回按序数组，任一rejected则立即reject；不支持忽略失败，需用safe包装或改用Promise.allSettled。

Promise.all 是 JavaScript 中用于并发执行多个 Promise 并等待它们**全部完成**的原生方法。它不会“等待”单个 Promise 慢慢跑完再启动下一个，而是同时触发所有传入的 Promise，然后返回一个新 Promise，这个新 Promise 在所有输入 Promise 都 fulfilled 时才 fulfilled；只要其中任意一个 rejected，它就立刻 rejected。

Promise.all 的基本行为和返回值

它接收一个可迭代对象（通常是数组），每个元素应是 Promise 或 thenable 对象。返回的 Promise 的结果是一个数组，顺序与输入数组严格一致，哪怕某些 Promise 完成得更晚。

• 输入：[Promise.resolve(1), fetch('/api/user'), new Promise(r => setTimeout(r, 100, 'done'))]
• 输出：fulfilled 时 resolve 为 [1, Response, 'done']（顺序不变）
• 一旦任意一个输入 Promise reject，Promise.all 立即 reject，值为第一个被 reject 的错误，其余仍在运行的 Promise 不会取消

常见错误：把非 Promise 值直接传进去

如果你传了普通值（比如字符串、数字、undefined），Promise.all 会自动用 Promise.resolve() 包装它——这本身没错，但容易误以为“没执行”，其实它已经算作“立即完成”的 Promise。

Promise.all([1, Promise.resolve(2), Promise.reject('oops')])
  .then(console.log)
  .catch(console.error); // 输出：'oops'

注意：这里 1 被转为 Promise.resolve(1)，所以它不会导致报错；真正让整个调用失败的是第三个 Promise。

如何真正“等待全部完成”，即使有失败？

Promise.all 本身做不到“忽略失败继续等其他完成”。如果需要这种行为，得手动包装每个 Promise，把 rejection 转为正常值（比如 { status: 'error', error }）：

const safe = (p) => p.then(v => ({ status: 'success', value: v }))
                      .catch(e => ({ status: 'error', error: e }));

Promise.all([
  safe(fetch('/api/a')),
  safe(fetch('/api/b')),
  safe(Promise.reject('timeout'))
]).then(results => {
  console.log(results);
  // [{ status: 'success', value: Response }, ... , { status: 'error', error: 'timeout' }]
});

这是实际项目中处理“尽力而为”批量请求的常用模式。

和 Promise.allSettled 的关键区别

Promise.allSettled 才是“不管成功失败，都等所有 Promise 结束后才返回结果”。它的返回值是每个 Promise 的状态对象数组（{ status: 'fulfilled' | 'rejected', value | reason }）。如果你不需要短路（即一个失败就终止），且想统一处理结果，优先考虑 Promise.allSettled 而不是自己封装 safe。

另外注意：Promise.all 在 Safari 10.1+、Chrome 51+、Firefox 49+ 支持；若需兼容老环境，必须用 polyfill 或 Babel 转译。

今天带大家了解了的相关知识，希望对你有所帮助；关于文章的技术知识我们会一点点深入介绍，欢迎大家关注golang学习网公众号，一起学习编程~