Кратко
СкопированоМетод then
используют, чтобы выполнить код после изменения состояния промиса.
Метод принимает два аргумента:
on
— функция-колбэк, которая будет вызвана при переходе промиса в состояние «успех»Fulfill fulfilled
. Функция имеет один параметр, в который передаётся результат выполнения операцииon
— функция-колбэк, которая будет вызвана при переходе промиса в состояние «ошибка»Reject rejected
. Функция имеет один параметр, в который передаётся информация об ошибке
Всегда возвращает новый промис.
Как пишется
Скопировано// getPasswords() — асинхронная функция, которая возвращает промисgetPasswords().then( function (result) { // что-то делаем с результатом операции console.log('Все пароли:' + result) }, function (err) { // обрабатываем ошибку console.error(err.message) })
// getPasswords() — асинхронная функция, которая возвращает промис getPasswords().then( function (result) { // что-то делаем с результатом операции console.log('Все пароли:' + result) }, function (err) { // обрабатываем ошибку console.error(err.message) } )
Как понять
СкопированоОбработка асинхронных операций через промис и then
очень похожа на работу с колбэками.
Так как then
всегда возвращает новый промис, то его удобно использовать для построения последовательностей асинхронных операций:
// запросим через API список домов из Игры престолов. Метод `fetch` возвращает промисfetch('https://www.anapioficeandfire.com/api/houses') .then(function (response) { // выполнится, когда от API придет ответ // запустим асинхронную операцию парсинга JSON из ответа сервера return response.json() // вернем из обработчика промис, к которому добавим then }) .then(function (houses) { // выполнится, когда JSON распарсится return fetch(houses[0].overlord) // запросим данные о сюзерене этого дома }) .then(function (response) { // выполнится, когда от API придет ответ return response.json() }) .then(function (overlord) { console.log(overlord.name) })
// запросим через API список домов из Игры престолов. Метод `fetch` возвращает промис fetch('https://www.anapioficeandfire.com/api/houses') .then(function (response) { // выполнится, когда от API придет ответ // запустим асинхронную операцию парсинга JSON из ответа сервера return response.json() // вернем из обработчика промис, к которому добавим then }) .then(function (houses) { // выполнится, когда JSON распарсится return fetch(houses[0].overlord) // запросим данные о сюзерене этого дома }) .then(function (response) { // выполнится, когда от API придет ответ return response.json() }) .then(function (overlord) { console.log(overlord.name) })
В коде выше, каждый вызов then
привязан к результату предыдущей операции. Такой код читается почти как синхронный.
На практике
Скопированосоветует Скопировано
🛠 then
в индустрии используется только для обработки успешного завершения операции, в варианте с одним аргументом:
getPasswords().then(function (result) { // что-то делаем с результатом операции console.log(`Все пароли: ${result}`)})
getPasswords().then(function (result) { // что-то делаем с результатом операции console.log(`Все пароли: ${result}`) })
Для обработки ошибок используют метод catch
. Такие цепочки читаются лучше:
getPasswords() .then(function (result) { console.log(`Все пароли: ${result}`) }) .catch(function (error) { console.log(`Ошибка: ${error.message}`) })
getPasswords() .then(function (result) { console.log(`Все пароли: ${result}`) }) .catch(function (error) { console.log(`Ошибка: ${error.message}`) })