JavaScript面试常考题：如何写Promise.all？从原理到实战全面解析

2023-10-20 12:11:55

前言

作为一名合格的前端工程师，在面试中总少不了对JavaScript的考察。其中，Promise.all是JavaScript中一个非常重要的概念，经常出现在面试题中。在本文中，我将从原理到实战，全面解析Promise.all，帮助你彻底掌握这个知识点。

Promise.all原理解析

Promise.all()方法接收一个Promise对象数组作为参数，并返回一个新的Promise对象。这个新Promise对象将在所有传入的Promise对象都解析或拒绝后解析或拒绝。

Promise.all()的工作原理如下：

创建一个新的Promise对象。
为每个传入的Promise对象添加一个回调函数，当该Promise对象解析或拒绝时，该回调函数将被调用。
当所有传入的Promise对象都解析或拒绝后，新创建的Promise对象将根据所有传入的Promise对象的状态解析或拒绝。
如果所有传入的Promise对象都解析，则新创建的Promise对象将解析，其结果为一个数组，包含所有传入的Promise对象解析后的结果。
如果任何一个传入的Promise对象拒绝，则新创建的Promise对象将拒绝，其结果为第一个被拒绝的Promise对象拒绝的原因。

Promise.all()的使用方式

Promise.all()方法的使用方式非常简单，只需将一个Promise对象数组作为参数传入即可。例如：

const promises = [
  fetch('https://example.com/data1'),
  fetch('https://example.com/data2'),
  fetch('https://example.com/data3')
];

Promise.all(promises)
  .then((values) => {
    // 所有请求都成功后，执行该回调函数
    console.log(values);
  })
  .catch((error) => {
    // 任何一个请求失败后，执行该回调函数
    console.error(error);
  });