Promise.all() 工作原理详解
Promise.all() 是一个静态方法，它接收一个由 Promise 实例组成的可迭代对象（例如数组），并返回一个新的 Promise。这个返回的 Promise 在以下两种情况下会发生状态变化：
- 所有输入 Promise 都成功（fulfilled）时：返回的 Promise 会成功，其结果是一个数组，包含所有输入 Promise 的成功值，并且这些值会按照输入 Promise 的原始顺序排列。
- 任何一个输入 Promise 失败（rejected）时：返回的 Promise 会立即失败，其失败原因就是第一个失败的 Promise 的失败原因。
关键在于，Promise.all() 返回的是一个单一的 Promise，它的 .then() 回调只会在所有内部 Promise 都成功后被调用一次，并且接收到的参数是所有结果的一个数组。
案例分析：理解 Promise.all 的输出行为
为了更好地理解 Promise.all() 的行为，我们来看一个常见的混淆点。考虑以下代码示例：
// 一个简单的 Promise，在给定时间后解决
const timeOut = (t) => {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(`Completed in ${t}`);
}, t);
});
};
// 独立解析一个 Promise
timeOut(1000)
.then(result => console.log(result)); // 预计输出: Completed in 1000
// 使用 Promise.all
Promise.all([timeOut(1000), timeOut(2000), timeOut(2000)])
.then(result => console.log(result));许多开发者可能会预期输出如下：
Completed in 1000 Completed in 2000 Completed in 2000 ['Completed in 1000', 'Completed in 2000', 'Completed in 2000']
然而，实际运行代码后，输出可能更接近：
Completed in 1000 ['Completed in 1000', 'Completed in 2000', 'Completed in 2000']
为什么会这样？
SmartB2B 是一款基于PHP、MySQL、Smarty的B2B行业电子商务网站管理系统，系统提供了供求模型、企业模型、产品模型、人才招聘模型、资讯模型等模块，适用于想在行业里取得领先地位的企业快速假设B2B网站，可以运行于Linux与Windows等多重服务器环境，安装方便，使用灵活。 系统使用当前流行的PHP语言开发，以MySQL为数据库，采用B/S架构，MVC模式开发。融入了模型化、模板
原因在于，Promise.all() 不会“触发”其内部 Promise 的独立 .then() 回调。它只关心这些 Promise 的最终状态和它们解析（或拒绝）的值。
- timeOut(1000).then(result => console.log(result))：这是一个独立的 Promise 链。当 timeOut(1000) 在 1000 毫秒后解决时，其 .then() 回调会被触发，并打印出 Completed in 1000。
- Promise.all([timeOut(1000), timeOut(2000), timeOut(2000)]).then(result => console.log(result))：这里的 Promise.all 接收三个 Promise。它会等待所有这三个 Promise 都解决。
- 第一个 timeOut(1000) 在 1000 毫秒后解决。
- 第二个 timeOut(2000) 在 2000 毫秒后解决。
- 第三个 timeOut(2000) 在 2000 毫秒后解决。 Promise.all 返回的 Promise 会在所有内部 Promise 都解决后（即大约 2000 毫秒后，因为最长的延迟是 2000 毫秒）才解决。此时，它的 .then() 回调被调用，并接收到一个包含所有结果的数组 ['Completed in 1000', 'Completed in 2000', 'Completed in 2000']，然后将其打印出来。
因此，你只会看到一个独立的 Completed in 1000 输出（来自第一个独立的 Promise），以及一个包含所有结果的数组输出（来自 Promise.all）。内部传递给 Promise.all 的 Promise 本身并没有连接 .then() 来进行独立打印。
正确使用 Promise.all 的示例
如果你希望在 Promise.all 聚合结果的同时，也能看到每个 Promise 的独立进展或处理，你需要为每个 Promise 单独添加 .then() 回调，或者在构建 Promise 数组时就进行处理。
const timeOut = (t) => {
return new Promise((resolve, reject) => {
setTimeout(() => {
console.log(`Promise ${t} started.`); // 可以看到每个 Promise 的启动
resolve(`Completed in ${t}`);
}, t);
});
};
// 组合 Promise，并在 Promise.all 中处理聚合结果
const p1 = timeOut(1000);
const p2 = timeOut(2000);
const p3 = timeOut(1500);
Promise.all([p1, p2, p3])
.then(results => {
console.log("All promises resolved:", results); // 聚合结果
})
.catch(error => {
console.error("One of the promises rejected:", error);
});
// 如果需要每个 Promise 独立处理，可以在传入 Promise.all 之前进行
const p4 = timeOut(500).then(res => {
console.log(`Individual promise 500ms resolved: ${res}`);
return res; // 确保将结果返回，以便 Promise.all 也能获取到
});
const p5 = timeOut(1200);
Promise.all([p4, p5])
.then(results => {
console.log("All promises (with one individual handler) resolved:", results);
});在这个例子中，console.log("Promise X started.") 会在每个 Promise 内部的 setTimeout 开始时打印，展示了它们的并发执行。而 Promise.all 的 .then() 则会在所有 Promise 都完成后，打印最终的聚合结果。
注意事项
-
错误处理：Promise.all() 是“全有或全无”的。如果其内部的任何一个 Promise 失败，Promise.all() 返回的 Promise 就会立即拒绝，并带上第一个拒绝的原因。此时，其他尚未完成的 Promise 仍然会继续执行，但它们的成功或失败将不再影响 Promise.all() 的最终状态。为了捕获错误，应在 Promise.all() 后面添加 .catch()。
Promise.all([ Promise.resolve('Success 1'), Promise.reject('Error occurred!'), // 这个 Promise 会导致 Promise.all 拒绝 Promise.resolve('Success 3') ]) .then(results => console.log(results)) .catch(error => console.error("Caught by Promise.all's catch:", error)); // 输出: Caught by Promise.all's catch: Error occurred! - Promise 顺序：Promise.all() 返回的结果数组的顺序与传入的可迭代对象中的 Promise 顺序保持一致，与它们实际完成的顺序无关。
-
空迭代器：如果传入一个空的可迭代对象（如空数组），Promise.all() 将立即成功，并返回一个空数组。
Promise.all([]) .then(results => console.log("Empty array results:", results)); // 输出: Empty array results: [] -
非 Promise 值：如果可迭代对象中包含非 Promise 值，Promise.all() 会将其视为已成功的 Promise，并直接将其值包含在结果数组中。
Promise.all([Promise.resolve(1), 'hello', 3]) .then(results => console.log(results)); // 输出: [1, 'hello', 3]
总结
Promise.all() 是处理并发异步操作的强大工具，它提供了一种简洁的方式来等待多个 Promise 完成并聚合它们的成功结果。理解其核心机制——返回一个单一的 Promise，并在所有内部 Promise 成功后一次性返回一个结果数组——对于避免常见的误解至关重要。正确地使用 Promise.all()，结合适当的错误处理，能够显著提升 JavaScript 异步代码的效率和可维护性。
