Promise.all()-js教程-PHP中文网

语法

返回值

成功和失败

实际示例

示例1：基本用法

示例2：混合值处理

示例3：失败处理

结论

首页

web前端

js教程

Promise.all()

Jan 21, 2025 pm 12:34 PM

Promise.all()

深入理解JavaScript中的Promise.all()

Promise.all()是JavaScript中一个强大的方法，用于同时处理多个异步操作。它接收一个可迭代对象（通常是数组），其中包含多个Promise，并返回一个单一的Promise。只有当所有输入的Promise都成功解析时，这个单一Promise才会解析；如果任何一个Promise被拒绝，则该单一Promise会立即被拒绝。本指南将探讨Promise.all()的功能、语法、行为以及实际示例。

语法

Promise.all()的语法很简单：

Promise.all(iterable);

登录后复制

iterable: 包含Promise或值的数组或其他可迭代对象。非Promise值将被视为已解析的Promise。

返回值

该方法返回一个Promise，具有以下行为：

如果iterable为空，则立即以空数组解析。
如果iterable中的所有Promise都已成功，则解析为一个包含已成功值的数组，并保持其原始顺序。
如果任何一个Promise被拒绝，则立即被拒绝，并返回第一个被拒绝的Promise的理由，忽略所有其他Promise的结果。

成功和失败

成功: 当所有Promise都成功解析时，Promise.all()返回一个结果数组，其顺序与输入Promise的顺序相同。
失败: 如果任何一个Promise被拒绝，Promise.all()将立即被拒绝，并返回该Promise的拒绝原因。

实际示例

示例1：基本用法

在这个例子中，我们创建三个Promise，它们在不同的超时后解析：

const promise1 = new Promise((resolve) => setTimeout(() => resolve('One'), 1000));
const promise2 = new Promise((resolve) => setTimeout(() => resolve('Two'), 2000));
const promise3 = new Promise((resolve) => setTimeout(() => resolve('Three'), 3000));

Promise.all([promise1, promise2, promise3])
  .then(values => console.log(values)) // 输出: ['One', 'Two', 'Three']
  .catch(error => console.error(error));

登录后复制

在这里，Promise.all()等待所有三个Promise都解析，然后将它们的结果作为一个数组记录到控制台。

示例2：混合值处理

你也可以混合已解析的值和Promise：

const p1 = Promise.resolve(42);
const p2 = Promise.resolve('Hello');
const p3 = new Promise((resolve) => setTimeout(() => resolve('World'), 1000));

Promise.all([p1, p2, p3])
  .then(values => console.log(values)) // 输出: [42, 'Hello', 'World']
  .catch(error => console.error(error));

登录后复制

在这种情况下，p1和p2立即解析，而p3在一秒钟后解析。

示例3：失败处理

如果其中一个Promise被拒绝，Promise.all()将立即被拒绝：

const p1 = Promise.resolve(42);
const p2 = Promise.reject(new Error('Failed!'));
const p3 = new Promise((resolve) => setTimeout(() => resolve('This will not run'), 1000));

Promise.all([p1, p2, p3])
  .then(values => console.log(values))
  .catch(error => console.error(error.message)); // 输出: 'Failed!'

登录后复制

这里，因为p2被拒绝，整个操作失败并记录错误信息。

`Promise.all()`的应用场景

获取多个资源: 当你需要同时从多个API获取数据，并在处理所有响应之前等待时。
并行处理: 同时执行多个独立的任务，并且需要将它们的结果组合在一起时。
批量操作: 执行批量更新或计算，其中每个操作都可以独立完成时。

结论

Promise.all()是管理JavaScript中多个异步操作的基本工具。它通过允许开发人员等待多个Promise解析后再继续执行其他逻辑来简化代码。但是，正确处理失败至关重要，因为任何一个Promise的失败都会导致整个操作失败。理解如何有效地使用Promise.all()可以编写更简洁、更高效的异步代码。