Краткий справочник

Шпаргалка по промисам в JavaScript (Promises)

Краткое руководство по промисам в JavaScript: конструктор, чейнинг, обработка ошибок, комбинаторы (all, allSettled, race, any) и async/await.

· Опубликовано

Объект Promise представляет результат успешного завершения (или неудачи) асинхронной операции и возвращаемое ею значение.

Состояния промиса (Promise States)

Промис всегда находится в одном из трех взаимоисключающих состояний:

  1. pending (ожидание): Начальное состояние, еще не выполнен и не отклонен.
  2. fulfilled (выполнен): Операция завершилась успехом (resolve(value)).
  3. rejected (отклонен): Операция завершилась ошибкой (reject(error)).

Конструктор и базовая цепочка then

const loadUser = (id) => {
  return new Promise((resolve, reject) => {
    fetch(`/api/users/${id}`)
      .then((res) => {
        if (!res.ok) throw new Error(`HTTP ${res.status}`);
        return res.json();
      })
      .then((data) => resolve(data))
      .catch((err) => reject(err));
  });
};

loadUser(42)
  .then((user) => console.log('Успешно загружено:', user.name))
  .catch((err) => console.error('Error:', err.message))
  .finally(() => console.log('Запрос полностью завершен'));

Статические методы разрешения

// Сразу выполненный промис
const p1 = Promise.resolve('Immediate value');

// Сразу отклоненный промис
const p2 = Promise.reject(new Error('Immediate failure'));

Комбинаторы промисов

Метод Поведение Условие ошибки
Promise.all([p1, p2]) Ожидает успешного выполнения всех промисов Любой из промисов отклонен (мгновенное прерывание)
Promise.allSettled([p1, p2]) Ожидает завершения всех промисов независимо от исхода Никогда не отклоняется
Promise.race([p1, p2]) Возвращает результат первого завершившегося промиса Первый завершившийся промис отклонен
Promise.any([p1, p2]) Выполняется при первом успешном промисе Все переданные промисы отклонены (AggregateError)
// Promise.all: Параллельное ожидание нескольких запросов
const [users, posts] = await Promise.all([
  fetchUsers(),
  fetchPosts()
]);

// Promise.allSettled: Безопасная проверка статуса каждого запроса
const results = await Promise.allSettled([reqA(), reqB()]);
results.forEach((res) => {
  if (res.status === 'fulfilled') console.log('Value:', res.value);
  else console.error('Reason:', res.reason);
});

Эквивалентный синтаксис с Async / Await

async function getUserData(id) {
  try {
    const res = await fetch(`/api/users/${id}`);
    const data = await res.json();
    return data;
  } catch (err) {
    console.error('Failed to retrieve user:', err);
    throw err;
  }
}

Ссылки и материалы

Связанные темы