В чем разница между Promise.all и await

1️⃣ Как кратко ответить

Promise.all используется для выполнения нескольких промисов параллельно и возвращает результат, когда все промисы завершены. await используется для ожидания завершения одного промиса в асинхронной функции, приостанавливая выполнение до получения результата.

2️⃣ Подробное объяснение темы

Promise.all и await — это два различных подхода для работы с асинхронными операциями в JavaScript, которые помогают управлять промисами, но они имеют разные цели и способы использования.

Promise.all

Promise.all — это метод, который принимает массив промисов и возвращает новый промис. Этот новый промис разрешается, когда все промисы в массиве успешно завершены, или отклоняется, если хотя бы один из промисов отклоняется. Это полезно, когда нужно дождаться завершения нескольких асинхронных операций одновременно.

Пример использования Promise.all:

const promise1 = fetch('https://api.example.com/data1');
const promise2 = fetch('https://api.example.com/data2');
const promise3 = fetch('https://api.example.com/data3');
​
Promise.all([promise1, promise2, promise3])
  .then((responses) => {
    // responses — это массив результатов всех промисов
    return Promise.all(responses.map(response => response.json()));
  })
  .then((data) => {
    // data — это массив данных, полученных из всех запросов
    console.log(data);
  })
  .catch((error) => {
    // Если хотя бы один промис отклоняется, выполнение переходит сюда
    console.error('Ошибка:', error);
  });

• fetch — функция, возвращающая промис, который разрешается с объектом ответа.
• Promise.all принимает массив промисов и возвращает новый промис.
• responses — массив объектов ответа, когда все промисы разрешены.
• Promise.all(responses.map(...)) — преобразует каждый ответ в JSON.
• data — массив данных, полученных из всех запросов.
• catch обрабатывает ошибку, если хотя бы один промис отклоняется.

await

await — это оператор, который используется внутри асинхронной функции для ожидания завершения промиса. Он приостанавливает выполнение функции до тех пор, пока промис не будет разрешен или отклонен. Это позволяет писать асинхронный код, который выглядит как синхронный.

Пример использования await:

async function fetchData() {
  try {
    const response1 = await fetch('https://api.example.com/data1');
    const data1 = await response1.json();
​
    const response2 = await fetch('https://api.example.com/data2');
    const data2 = await response2.json();
​
    const response3 = await fetch('https://api.example.com/data3');
    const data3 = await response3.json();
​
    console.log([data1, data2, data3]);
  } catch (error) {
    console.error('Ошибка:', error);
  }
}
​
fetchData();

• async function fetchData() — объявление асинхронной функции.
• await fetch(...) — ожидание завершения промиса, возвращаемого fetch.
• response1.json() — преобразование ответа в JSON.
• try...catch — обработка ошибок, возникающих при выполнении асинхронных операций.

Основные различия

• Параллельное выполнение: Promise.all позволяет выполнять несколько промисов параллельно, что может быть более эффективно, если операции не зависят друг от друга. await выполняет промисы последовательно, что может быть полезно, если результат одной операции зависит от другой.
• Обработка ошибок: Promise.all отклоняется, если хотя бы один промис отклоняется, и это может быть полезно для быстрого выхода из цепочки промисов. await позволяет обрабатывать ошибки для каждой операции отдельно с помощью try...catch.
• Синтаксис: Promise.all используется с методом then для обработки результатов, тогда как await позволяет писать код, который выглядит как синхронный, улучшая читаемость.