JavaScript обещания. Часть 1
Если вы когда-либо видели что-то подобное:
p.then(function(result) {
// выполняем некое действие с результатом
});
то вы уже находитесь на один шаг ближе к пониманию обещаний в JavaScript. Если же нет, то в данном цикле статей вы изучите их вдоль и поперек, используя большое количество примеров.
Для некоторых концепция обещаний может показаться несколько сложной для восприятия и понимания, так JavaScript промисы отражают совершенно иную манеру программистского мышления. Однако с того момента как вы увидите промисы в деле и осознаете их преимущества, вы будете предпочитать их использование. Они действительно делают описание сложных асинхронных задач легче, помогая избегать множества уровней вложенных callback-ов – так называемого ада коллбэков.
Основная же идея, стоящая за промисами заключается в следующем:
Обещания JavaScript - представляют собой конечный результат асинхронной операции. Это означает, что невозможно получить доступ к результату асинхронной операции немедленно. Вместо этого необходимо подождать до тех пор, пока обещание будет выполнено.
Пример из жизни. Когда вы говорите вашей матери, например, “я обещаю выкинуть мусор“ – это означает, что вы выполните обещание и выбросите мусор через некоторое время в этот день. Вы можете выполнить это обещание через пару минут или пару часов.
Такая же идея лежит и в основе промисов. Когда функция возвращает обещание, “она говорит – вот мое обещание, что вернусь к тебе с результатом так скоро, как закончу работу над задачей”.
А теперь вместо того, чтобы занимать вас скучной теорией и терминологией, давайте сразу возьмемся за практику, походу дела подкрепляя ее необходимыми комментариями.
Скорее всего, вы уже имели дело с AJAX запросами. Если нет, то вот вам в помощь мой Видеокурс "JavaScript, jQuery и Ajax с Нуля до Гуру", который научит вас и AJAX запросы выполнять и, вообще, много чему еще. Для выполнения AJAX-запросов, обычно используют, либо объект XMLHttpRequest, либо метод $.get() из JQuery, либо еще какую либо JavaScript библиотеку.
Но, известно, что прикладной интерфейс XMLHttpRequest не так прост в использовании. Однако, благодаря новому fetch API в AJAX запросы вдохнули новую жизнь. И в нем используются промисы для обработки результатов.
Так, что же это означает, когда я говорю, что fetch API использует обещания. Когда вы делаете запросы с помощью функции fetch(), вот так:
fetch(‘/api/post/123’);
она будет возвращать объект промиса.
Раньше, нам нужно было бы передавать callback-функцию, которая была бы вызвана, когда асинхронный запрос завершен. Но при работе с промисами мы используем метод .then(onFulfilled, onRejected). Мы можем создавать цепочки вызовов метода .then() для доступа к результату вызова функции fetch().
fetch(‘/api/post/123’).then(function (result) {
console.log('Результат запроса' + result);
}, function (error){
console.log('Ошибка: ' + error);
})
Метод .then позволяет получать нам доступ к результату его вызова через 2 дополнительных аргумента:
- onFulfilled – вызывается, когда обещание завершено успешно. В качестве первого аргумента оно принимает значение обещания.
- onRejected – вызывается, когда обещание не выполнено. В качестве первого аргумента в него передается причина отказа.
Как вы могли заметить, я употребил два новых термина, выполнено и отклонено, которые называются состояниями (states) обещания. Кроме этих двух состояний, существует еще и третье, в котором может находиться обещание – “ожидающее” – (pending).
Теперь давайте рассмотрим, что это означает в контексте нашего вышеупомянутого примера.
- Вызов fetch() возвращает обещание, как упоминалось выше.
- Обещание будет в ожидающем состоянии тех пор пока запрос не завершен.
- Из состояния ожидания, обещание может перейти в состояние выполненное или отклоненное.
Надо отметить, что как только состояние JavaScript обещания изменилось на выполненное или отклоненное, его значение уже изменено быть не может.
Таким образом, данная статья является вводной статьей в цикле статей про промисы в JavaScript. В ней были представлены общие сведения о том, что такое промисы, в каких состояниях они могут находиться. А в следующих статьях мы продолжим рассматривать промисы (обещания) в JavaScript.
-
Создано 05.07.2018 08:05:51
-
Михаил Русаков
Комментарии (0):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.