Какие знаешь состояния Promise

Вопрос

Какие знаешь состояния Promise

Профессия

Frontend Developer

Что хочет услышать интервьюер

Интервьюер хочет убедиться, что кандидат понимает основные состояния Promise и может объяснить их значение и использование в асинхронных операциях.

Ключевые тезисы

• Promise может находиться в одном из трех состояний: pending (ожидание), fulfilled (выполнено) или rejected (отклонено).
• Состояние pending означает, что асинхронная операция еще не завершена, и результат не определен.
• Состояние fulfilled указывает на успешное завершение операции, и Promise возвращает значение.
• Состояние rejected означает, что операция завершилась с ошибкой, и Promise возвращает причину отказа.
• Состояние Promise неизменяемо после того, как оно установлено (fulfilled или rejected).

Подробный ответ

Promise (Обещание) в JavaScript представляет собой объект, который используется для отложенных и асинхронных вычислений. Promise может находиться в одном из трех состояний: pending (ожидание), fulfilled (выполнено) или rejected (отклонено). Состояние pending является начальным и означает, что асинхронная операция еще не завершена, и результат не определен. Как только операция завершается успешно, Promise переходит в состояние fulfilled и возвращает значение. Если операция завершается с ошибкой, Promise переходит в состояние rejected и возвращает причину отказа. Важно отметить, что состояние Promise неизменяемо после того, как оно установлено (fulfilled или rejected). Это гарантирует, что результат Promise не может быть изменен после его завершения, что делает Promise надежным инструментом для работы с асинхронным кодом.

Практические примеры

Пример 1

Создание и использование Promise

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('Успешное выполнение');
  }, 1000);
});

myPromise

.then((value) => {
    console.log(value); // 'Успешное выполнение'
  })
  .catch((error) => {
    console.error(error);
  });

Пример 2

Обработка ошибок в Promise

const errorPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject(new Error('Что-то пошло не так'));
  }, 1000);
});

errorPromise

.then((value) => {
    console.log(value);
  })
  .catch((error) => {
    console.error(error.message); // 'Что-то пошло не так'
  });

Пример 3

Цепочка вызовов .then()

const chainPromise = new Promise((resolve) => {
  resolve(1);
});

chainPromise

.then((value) => {
    console.log(value); // 1
    return value + 1;
  })
  .then((value) => {
    console.log(value); // 2
    return value + 1;
  })
  .then((value) => {
    console.log(value); // 3
  });

Частые ошибки

• Типичная ошибка: Необработка состояния rejected. Если не добавить .catch() к Promise, ошибка может быть 'проглочена', что затруднит отладку.
• Еще одна ошибка: Попытка изменить состояние Promise после его завершения. Состояние Promise неизменяемо после установки, поэтому попытка вызвать resolve или reject после завершения не будет иметь эффекта.

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

• async/await. Это синтаксический сахар над Promise, который делает асинхронный код более читаемым и удобным для написания.
• Еще одна связанная тема: Promise.all и Promise.race. Эти методы позволяют работать с несколькими Promise одновременно, что полезно для параллельного выполнения асинхронных операций.

Follow-up вопросы

Как можно обработать состояние rejected в Promise?

Уровень: basic

Для обработки состояния rejected можно использовать метод .catch() или второй аргумент в .then(). Это позволяет перехватить ошибку и выполнить необходимые действия.

Можно ли изменить состояние Promise после его выполнения?

Уровень: intermediate

Нет, состояние Promise неизменяемо после того, как оно установлено (fulfilled или rejected). Это гарантирует надежность и предсказуемость асинхронных операций.

Что происходит, если не обработать состояние rejected в Promise?

Уровень: intermediate

Если не обработать состояние rejected, ошибка будет проигнорирована, и это может привести к незаметным сбоям в работе приложения. В некоторых случаях это может вызвать "непойманную ошибку" (uncaught error).

Как работает цепочка вызовов .then() и .catch()?

Уровень: advanced

Цепочка вызовов позволяет последовательно обрабатывать результаты Promise. Если один из .then() возвращает новое Promise, следующий .then() будет ждать его завершения. Если возникает ошибка, управление передается ближайшему .catch().

Какие преимущества использования async/await по сравнению с Promise?

Уровень: advanced

Async/await упрощает чтение и написание асинхронного кода, делая его более похожим на синхронный. Также он позволяет использовать try/catch для обработки ошибок, что делает код более структурированным.