Как вызовешь одновременно несколько Promise и дождешься ответы одновременно?

Promise.all() для одновременного выполнения

Для выполнения нескольких Promise одновременно и ожидания всех результатов используется метод Promise.all().

Promise.all() — основной способ

// Создаем несколько Promise
const promise1 = fetch('https://api.example.com/users');
const promise2 = fetch('https://api.example.com/posts');
const promise3 = fetch('https://api.example.com/comments');

// Ждем все Promise одновременно
Promise.all([promise1, promise2, promise3])
  .then(responses => {
    console.log('Все запросы выполнены!');
    console.log(responses); // массив результатов
  })
  .catch(error => {
    console.error('Ошибка одного из запросов:', error);
  });

С async/await (современный способ)

async function fetchAllData() {
  try {
    const [users, posts, comments] = await Promise.all([
      fetch('https://api.example.com/users').then(r => r.json()),
      fetch('https://api.example.com/posts').then(r => r.json()),
      fetch('https://api.example.com/comments').then(r => r.json())
    ]);

    console.log('Пользователи:', users);
    console.log('Посты:', posts);
    console.log('Комментарии:', comments);
  } catch (error) {
    console.error('Ошибка:', error);
  }
}

fetchAllData();

Promise.allSettled() — если нужны ошибки

Если один Promise отклонится, Promise.all() прерывается. Для получения результатов всех Promise, включая ошибки, используй Promise.allSettled():

const requests = [
  fetch('https://api.example.com/users'),
  fetch('https://api.example.com/posts'),
  fetch('https://broken-url.com/error') // ошибка
];

Promise.allSettled(requests)
  .then(results => {
    results.forEach((result, index) => {
      if (result.status === 'fulfilled') {
        console.log(`Запрос ${index} успешен:`, result.value);
      } else {
        console.log(`Запрос ${index} ошибка:`, result.reason);
      }
    });
  });

Promise.race() — получить первый результат

Если нужен результат первого выполненного Promise:

const promise1 = new Promise(resolve => 
  setTimeout(() => resolve('1 сек'), 1000)
);
const promise2 = new Promise(resolve => 
  setTimeout(() => resolve('2 сек'), 2000)
);

Promise.race([promise1, promise2])
  .then(result => {
    console.log(result); // '1 сек'
  });

Практический пример с API

async function loadUserWithData(userId) {
  try {
    // Загружаем юзера и его посты одновременно
    const [user, posts, comments] = await Promise.all([
      fetch(`https://api.example.com/users/${userId}`).then(r => r.json()),
      fetch(`https://api.example.com/users/${userId}/posts`).then(r => r.json()),
      fetch(`https://api.example.com/users/${userId}/comments`).then(r => r.json())
    ]);

    return { user, posts, comments };
  } catch (error) {
    console.error('Ошибка загрузки данных:', error);
    throw error;
  }
}

Сравнение методов

Promise.all() — все должны успешно выполниться, иначе ошибка Promise.allSettled() — ждет всех, независимо от ошибок Promise.race() — берет первый результат

Ключевые моменты

• Все Promise выполняются параллельно, а не последовательно
• Promise.all() отклоняется, если хотя бы один Promise ошибется
• Результаты возвращаются в том же порядке, что и входные Promise
• Promise.allSettled() никогда не отклоняется, нужно проверять статусы
• Используй async/await для более читаемого кода

Это основные способы работы с несколькими Promise одновременно в JavaScript.