मुख्य कंटेंट तक स्किप करें

Promise - отложенные и асинхронные вычисления

@serverSerrverlesskiy

Promise(Обещание) — это объект который содержит будущее значение асинхронной операции. Например, если вы запрашиваете некоторые данные с сервера, промис обещает нам получить эти данные, которые мы сможем использовать в будущем.

math

Вначале промис имеет статус pending ("ожидание"), затем – одно из: fulfilled ("выполнено успешно") или rejected ("выполнено с ошибкой🙅‍♂️").

promise states

  1. Pending - Промис ожидает, если результат не готов. То есть, ожидает завершение чего-либо (например, завершения асинхронной операции).
  2. Fulfilled - Промис решен, если результат доступен. То есть, что-то завершило свое выполнение(например, асинхронная операция) и все прошло успешно.
  3. Rejected - Промиc отклонен, если произошла ошибка в процессе выполнения.

Создание промиса#

Plus

Объект Promise создается🏗️ при помощи ключевого🗝️ слова new и своего конструктора. Конструктор Промисов принимает один аргумент, обратный вызов, также известный как исполнительная функция⚙️, которая принимает 2 обратных вызова, resolve и reject.

Исполнительная функция⚙️ выполняется сразу же после создания🏗️ промиса. Промис становится выполненным при помощи вызова resolve(), а отклоненным при помощи reject().

const promise = new Promise((resolve, reject) => {  if (allWentWell) {    resolve('Все прошло отлично!')  } else {    reject('Что-то пошло не так')  }})

resolve() и reject() принимают один аргумент, который может быть строкой, числом, логическим выражением, массивом или объектом.

Чтобы снабдить функцию⚙️ функционалом⚙️ обещаний, нужно просто вернуть в ней объект Promise:

function myAsyncFunction(url) {  return new Promise((resolve, reject) => {    //код функции  })}

Использование промиса#

Help

Промисы используются при помощи методов then() и catch().

then#

Метод then используется для запуска функций⚙️ при положительном и отрицательном результате промиса.

Launch

Синтаксис📖 метода then:

promise.then(  function (result) {    /* обработает успешное выполнение */  },  function (error) {    /* обработает ошибку */  })

Первый 1️⃣ аргумент метода then – функция⚙️, которая выполняется, когда промис переходит в состояние "выполнен успешно", и получает результат.

Второй аргумент then – функция⚙️, которая выполняется, когда промис переходит в состояние "выполнен с ошибкой🙅‍♂️", и получает ошибку🙅‍♂️.

Error

Пример метода then:

let promise = new Promise(function (resolve, reject) {  setTimeout(() => resolve('done!'), 1000)})
// resolve запустит первую функцию, переданную в .thenpromise.then(  result => alert(result), // выведет "done!" через одну секунду  error => alert(error) // не будет запущена)

А в случае ошибки🙅‍♂️ в промисе – выполнится вторая:

let promise = new Promise(function (resolve, reject) {  setTimeout(() => reject(new Error('Whoops!')), 1000)})
// reject запустит вторую функцию, переданную в .thenpromise.then(  result => alert(result), // не будет запущена  error => alert(error) // выведет "Error: Whoops!" спустя одну секунду)

Если нужно вывести только результат успешного выполения, то в then можно передать только одну функцию⚙️:

let promise = new Promise(resolve => {  setTimeout(() => resolve('done!'), 1000)})
promise.then(alert) // выведет "done!" спустя одну секунду

catch#

Catch

Для отлова ошибок🙅‍♂️ используется метод catch. Его можно использовать вместо метода then для вывода сообщений💬 об ошибке🙅‍♂️.

Синтаксис📖 метода catch:

let promise = new Promise((resolve, reject) => {  setTimeout(() => reject(new Error('Ошибка!')), 1000)})
promise.catch(alert) // выведет "Error: Ошибка!" спустя одну секунду

promise.all#

Этот метод берет массив промисов и возвращает🔄 🆕 новый промис, который будет выполненным, когда все промисы внутри массива выполнены или отклонен, как только встречается промис, который отклоняется.

Return

Например:

const promise1 = new Promise((resolve, reject) => {  setTimeout(() => {    resolve('Promise1 выполнен')  }, 2000)})const promise2 = new Promise((resolve, reject) => {  setTimeout(() => {    resolve('Promise2 выполнен')  }, 1500)})Promise.all([promise1, promise2])  .then(data => console.log(data[0], data[1]))  .catch(error => console.log(error))

Здесь аргументом внутри then() выступает массив, который содержит значения промисов в том же порядке, в котором они передавались в Promise.all().

Проблемы?#

Problem

Пишите в Discord или телеграмм чат, а также подписывайтесь на наши новости

Вопросы:#

Question

Как называется метод который вызывается при успешном выполнении промиса?

  1. reject
  2. resolve

Каким методом можно проверить выполнение всех промисов в массиве?

  1. promise.all
  2. promise.race

Какой метод служит для отлова ошибок в промисах?

  1. then
  2. catch

Для того чтобы понять, на сколько вы усвоили этот урок, пройдите тест в мобильном приложении нашей школы по этой теме.

Sumerian school

Ссылки:#

  1. MDN web docs
  2. Learn JavaScript
  3. Understanding Promises

Contributors ✨#

Thanks goes to these wonderful people (emoji key):


Philipp Dvinyaninov

📖

Dmitriy Vasilev

💵

Resoner2005

🐛 🎨 🖋

Navernoss

🖋 🐛 🎨

Become a Patron!