Что такое промисы в JS

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

Промисы в JavaScript — это объект, представляющий завершение или неудачу асинхронной операции и её результат. Они позволяют обрабатывать асинхронные операции более последовательно и управляемо, чем колбэки, предоставляя методы .then(), .catch() и .finally() для обработки успешного выполнения, ошибок и завершения операции соответственно.

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

Промисы в JavaScript — это механизм для работы с асинхронными операциями. Они позволяют писать код, который выполняется после завершения асинхронной операции, без необходимости вкладывать колбэки друг в друга, что часто приводит к так называемому "адскому колбэку" (callback hell).

Зачем нужны промисы

Асинхронные операции, такие как запросы к серверу, чтение файлов или таймеры, не могут быть выполнены мгновенно. Промисы позволяют JavaScript продолжать выполнение других задач, пока асинхронная операция не завершится, и затем обрабатывать результат этой операции.

Как работают промисы

Промис может находиться в одном из трёх состояний:

• Pending (ожидание): начальное состояние, операция ещё не завершена.
• Fulfilled (выполнено): операция завершена успешно, и промис имеет результат.
• Rejected (отклонено): операция завершена с ошибкой, и промис имеет причину отказа.

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

Рассмотрим пример, где мы создаём промис, который симулирует асинхронную операцию, такую как запрос данных с сервера:

// Создание нового промиса
let myPromise = new Promise((resolve, reject) => {
    // Симуляция асинхронной операции с использованием setTimeout
    setTimeout(() => {
        let success = true; // Переменная, определяющая успешность операции
​
        if (success) {
            resolve("Данные успешно получены!"); // Операция успешна, вызываем resolve
        } else {
            reject("Ошибка при получении данных."); // Операция не удалась, вызываем reject
        }
    }, 2000); // Задержка в 2 секунды
});
​
// Обработка успешного выполнения промиса
myPromise.then((message) => {
    console.log(message); // Выводит: "Данные успешно получены!"
})
​
// Обработка ошибки
.catch((error) => {
    console.error(error); // Выводит: "Ошибка при получении данных."
})
​
// Действие, которое выполняется в любом случае
.finally(() => {
    console.log("Операция завершена."); // Выводит: "Операция завершена."
});

Объяснение кода

1. Создание промиса: new Promise((resolve, reject) => {...}) — создаём новый промис, который принимает функцию с двумя параметрами: resolve и reject. Эти функции используются для указания успешного завершения или ошибки.

2. Асинхронная операция: setTimeout(() => {...}, 2000); — симулируем асинхронную операцию с задержкой в 2 секунды.

3. Успешное завершение: resolve("Данные успешно получены!"); — вызывается, если операция успешна. Это переводит промис в состояние "выполнено".

4. Ошибка: reject("Ошибка при получении данных."); — вызывается, если операция завершилась с ошибкой. Это переводит промис в состояние "отклонено".

5. Обработка результата:

   • .then((message) => {...}) — вызывается, если промис выполнен успешно. Получает результат операции.
   • .catch((error) => {...}) — вызывается, если промис отклонён. Получает причину отказа.
   • .finally(() => {...}) — вызывается в любом случае после завершения промиса, независимо от его состояния.

Промисы делают код более читаемым и управляемым, особенно при работе с цепочками асинхронных операций.