cpp

Объект Promise

Функция fetch() возвращает объект Promise, который используется для выполнения отложенных или асинхронных вычислений. Давайте научимся с ним работать, прежде чем продолжим рассмотрение Fetch API. Создать объект Promise позволяет следующий конструктор:

const myPromise = new Promise( function(resolve, reject) {
   // ...
});

Конструктор принимает ссылку на функцию с двумя параметрами, являющимися ссылками на функции:

  • resolve(<Данные>) — вызывает успешное выполнение операции. Значение, указанное в параметре <Данные>, доступно внутри функции, назначенной через первый параметр метода then():
const myPromise = new Promise( function(resolve, reject) {
   setTimeout( function() {
      resolve('test');
   }, 500);
});
myPromise.then( function(value) {
   console.log(value);     // test
   console.log(myPromise);
   // Promise { <state>: "fulfilled", <value>: "test" }
});
console.log(myPromise);    // Promise { <state>: "pending" }
  • reject(<Объект исключения>) — отклоняет выполнение операции. Объект исключения доступен внутри функции, назначенной через второй параметр метода then(), а также внутри функции, назначенной методом catch():
const myPromise = new Promise( function(resolve, reject) {
   setTimeout( function() {
      reject( new Error('Описание ошибки') );
   }, 500);
});
myPromise.then(
   function(value) {       // Функция вызвана не будет
      console.log(value);
   },
   function(err) {
      console.log(err);    // Error: Описание ошибки
   });
myPromise.catch( function(e) {
   console.log(e);         // Error: Описание ошибки
   console.log(myPromise);
   // Promise { <state>: "rejected", <reason>: Error }
});
console.log(myPromise); // Promise { <state>: "pending" }

Возвращаемое функцией значение игнорируется.

Объект Promise может находиться в следующих состояниях:

  • pending — режим ожидания (начальное состояние);
  • fulfilled — успешное выполнение операции;
  • rejected — выполнение операции отклонено.

Создать объект Promise позволяют также следующие статические методы:

  • resolve(<Данные>) — возвращает объект Promise со статусом fulfilled. Значение, указанное в параметре <Данные>, доступно внутри функции, назначенной через первый параметр метода then():
Promise.resolve('test').then( function(value) {
   console.log(value); // test
});
  • reject(<Объект исключения>) — возвращает объект Promise со статусом rejected. Объект исключения доступен внутри функции, назначенной через второй параметр метода then():
Promise.reject( new Error('Описание ошибки') )
       .then(
          function(value) {       // Функция вызвана не будет
             console.log(value);
          },
          function(err) {
             console.log(err);    // Error: Описание ошибки
          });

Обработать изменение статуса позволяют следующие методы:

  • then(<Функция1>[, <Функция2>]) — вызывает функцию <Функция1>, когда операция успешно выполнена, или функцию <Функция2>, если выполнение операции отклонено. Метод возвращает объект Promise, содержащий результат, возвращаемый функцией. Этот результат доступен через параметр функции <Функция1>, при вызове следующего метода then():
Promise.resolve(10).then( function(value) {
   console.log(value);      // 10
   return value + 5;
}).then( function(value) {
   console.log(value);      // 15
}).then( function(value) {
   console.log(value);      // undefined
});
  • catch(<Функция>) — вызывает функцию, ссылка на которую указана в качестве параметра, при возникновении исключения или если выполнение операции отклонено. Внутри функции через параметр доступен объект с описанием исключения. Метод возвращает объект Promise. Пример:
const myPromise = new Promise( function(resolve, reject) {
   setTimeout( function() {
      reject( new Error('Описание ошибки') );
   }, 500);
});
myPromise.catch( function(e) {
   console.log(e);         // Error: Описание ошибки
});

Функция, назначенная методом catch(), будет также вызвана при возникновении исключения внутри функции обратного вызова:

const myPromise = new Promise( function(resolve, reject) {
   throw new Error('Описание ошибки');
});
myPromise.catch( function(e) {
   console.log(e);         // Error: Описание ошибки
});

Однако если исключение возникло внутри асинхронной функции, то функция, назначенная методом catch(), вызвана не будет:

const myPromise = new Promise( function(resolve, reject) {
   setTimeout( function() {
      throw new Error('Описание ошибки');
   }, 500);
});
myPromise.catch( function(e) { // Функция вызвана не будет
   console.log(e);
});

Если исключение возникло после вызова resolve(), то оно будет проигнорировано:

const myPromise = new Promise( function(resolve, reject) {
   resolve('test');
   throw new Error('Описание ошибки');
});
myPromise.then( function(value) {
   console.log(value);         // test
});
myPromise.catch( function(e) { // Функция вызвана не будет
   console.log(e);
});

Для работы с объектом Promise можно также использовать следующие статические методы:

  • all(<iterable>) — возвращает объект Promise, который получит статус fulfilled, если все указанные объекты будут иметь статус fulfilled. В качестве параметра указывается объект, поддерживающий итерации, например, массив с объектами Promise. Пример:
const myPromise1 = new Promise( function(resolve, reject) {
   setTimeout( function() {
      resolve('test');
   }, 500);
});
const myPromise2 = Promise.resolve(10);
Promise.all([myPromise1, myPromise2]).then( function(values) {
   console.log(values);         // Array [ "test", 10 ]
});

Как видно из результата, через параметр values доступны все значения в виде массива.

Если один из объектов получит статус rejected, то возвращаемый объект Promise сразу получит статус rejected:

const myPromise1 = new Promise( function(resolve, reject) {
   setTimeout( function() {
      resolve('test');
   }, 500);
});
const myPromise2 = new Promise( function(resolve, reject) {
   setTimeout( function() {
      reject( new Error('Описание ошибки') );
   }, 300);
});
Promise.all([myPromise1, myPromise2]).then(
   function(values) {          // Функция не вызывается
      console.log(values);
   },
   function(err) {
      console.log(err);         // Error: Описание ошибки
   });
  • race(<iterable>) — возвращает объект Promise, который получит статус fulfilled или rejected, в зависимости от статуса первого завершенного объекта. В качестве параметра указывается объект, поддерживающий итерации, например, массив с объектами Promise. Пример:
const myPromise1 = new Promise( function(resolve, reject) {
   setTimeout( function() {
      resolve('test');
   }, 500);
});
const myPromise2 = new Promise( function(resolve, reject) {
   setTimeout( function() {
      reject( new Error('Описание ошибки') );
   }, 300);
});
Promise.race([myPromise1, myPromise2]).then(
   function(value) {
      console.log(value);
   },
   function(err) {
      console.log(err);         // Error: Описание ошибки
   });

В этом примере первым был завершен объект myPromise2 со статусом rejected. Поэтому возвращенный методом race() объект также получит статус rejected. Если мы увеличим время задержки с 300 до, скажем, 800, то первым будет завершен объект myPromise1 со статусом fulfilled. Поэтому возвращенный методом race() объект также получит статус fulfilled, а значение "test" будет доступно через параметр value.

Учебник по jQuery и AJAX
Учебник по jQuery и AJAX в формате PDF

Помощь сайту

ЮMoney (Yandex-деньги): 410011140483022

ПАО Сбербанк:
Счет: 40817810855006152256
Реквизиты банка:
Наименование: СЕВЕРО-ЗАПАДНЫЙ БАНК ПАО СБЕРБАНК
Корреспондентский счет: 30101810500000000653
БИК: 044030653
КПП: 784243001
ОКПО: 09171401
ОКОНХ: 96130
Скриншот реквизитов

cpp