run-dev

Промисы в JavaScript: создание и обработка промисов в JS

Промисы в JavaScript используются для работы с асинхронным кодом. Они позволяют избежать вложенности колбэков и упрощают обработку ошибок.

Что такое промис?

Промис (Promise) представляет собой объект, который находится в одном из трёх состояний:

  • pending – ожидание результата;
  • fulfilled – успешно выполнен;
  • rejected – отклонён с ошибкой.

Создаётся через конструктор Promise, принимающий функцию с двумя параметрами: resolve (для успешного выполнения) и reject (для ошибки).

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Данные загружены");
  }, 2000);
});

Методы обработки промисов

then()

Метод then() вызывается при успешном выполнении промиса.

promise.then(result => {
  console.log(result); // "Данные загружены"
});

catch()

Метод catch() используется для обработки ошибок.

const failedPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject("Ошибка загрузки");
  }, 2000);
});

failedPromise
  .then(result => console.log(result))
  .catch(error => console.log(error)); // "Ошибка загрузки"

finally()

Метод finally() выполняется в любом случае — независимо от того, был промис выполнен или отклонён.

failedPromise
  .then(result => console.log(result))
  .catch(error => console.log(error))
  .finally(() => console.log("Завершение операции"));

Цепочка промисов

Промисы позволяют строить цепочки операций.

new Promise(resolve => {
  setTimeout(() => resolve(1), 1000);
})
  .then(result => {
    console.log(result); // 1
    return result * 2;
  })
  .then(result => {
    console.log(result); // 2
    return result * 3;
  })
  .then(result => {
    console.log(result); // 6
  });

Методы Promise API

Promise.all()

Метод Promise.all() выполняет несколько промисов параллельно и возвращает массив результатов. Если хотя бы один промис завершается с ошибкой, весь Promise.all() отклоняется.

const promise1 = new Promise(resolve => setTimeout(() => resolve(1), 1000));
const promise2 = new Promise(resolve => setTimeout(() => resolve(2), 2000));
const promise3 = new Promise(resolve => setTimeout(() => resolve(3), 3000));

Promise.all([promise1, promise2, promise3])
  .then(results => console.log(results)) // [1, 2, 3]
  .catch(error => console.log(error));

Promise.race()

Метод Promise.race() возвращает первый завершившийся промис.

Promise.race([promise1, promise2, promise3])
  .then(result => console.log(result)); // 1

Promise.allSettled()

Метод Promise.allSettled() ожидает выполнения всех промисов, но не отклоняется при ошибке.

const failed = new Promise((_, reject) => setTimeout(() => reject("Ошибка"), 1500));

Promise.allSettled([promise1, failed])
  .then(results => console.log(results));

async/await: упрощённая работа с промисами

Ключевые слова async и await позволяют писать асинхронный код в синхронном стиле.

async function fetchData() {
  try {
    let result = await promise;
    console.log(result);
  } catch (error) {
    console.log(error);
  }
}

fetchData();

Промисы упрощают работу с асинхронными операциями и позволяют строить цепочки выполнения. Методы then(), catch(), finally() помогают управлять результатами, а Promise.all() и Promise.race() дают возможность работать с несколькими промисами одновременно. async/await делает код ещё более читаемым.

Больше записей