.finally()

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

Время чтения: меньше 5 мин

Кратко

Секция статьи "Кратко"

Метод finally() используют для выполнения кода при завершении промиса. Код выполнится как при переходе промиса в состояние fulfilled, так и в rejected.

Метод принимает один аргумент:

  • onDone — функция-колбэк, которая будет вызвана при завершении промиса.

Возвращает новый промис.

Как пишется

Секция статьи "Как пишется"
        
          
          // getPasswords() — асинхронная функция, которая возвращает промисgetPasswords().finally(function () {  // выполнится, когда операция завершилась успехом или ошибкой})
          // getPasswords() — асинхронная функция, которая возвращает промис
getPasswords().finally(function () {
  // выполнится, когда операция завершилась успехом или ошибкой
})

        
        
          
        
      

Как понять

Секция статьи "Как понять"

finally() выполняет переданный ему колбэк независимо от того, как завершилась асинхронная операция.

Метод используют для того, чтобы избежать повторения кода между then() и catch(). Обычно такой код занимается уборкой после операции — скрывает индикаторы загрузки, закрывает меню и т.д.

Колбэк у finally() не содержит параметров. Это следствие того, что колбэк будет вызван как при успехе, так и при ошибке.

На практике

Секция статьи "На практике"

Николай Лопин советует

Секция статьи "Николай Лопин советует"

🛠 finally() отлично работает в случаях, когда нужно убрать лоадер со страницы или кнопки. Он сработает вне зависимости от результата промиса, поэтому можно избежать дублирования кода.

Вместо:

        
          
          // используем, флаг чтобы показать что форма отправляетсяlet isLoading = truesendForm().then((res) => {    isLoading = false    alert('ok')}).catch((err) => {    isLoading = false    alert(`Ошибка: ${err.message}`)})
          // используем, флаг чтобы показать что форма отправляется
let isLoading = true
sendForm().then((res) => {
    isLoading = false
    alert('ok')
}).catch((err) => {
    isLoading = false
    alert(`Ошибка: ${err.message}`)
})

        
        
          
        
      

Можно написать:

        
          
          let isLoading = truesendForm().then((res) => {    alert('ok')}).catch((err) => {    alert(`Ошибка: ${err.message}`)}).finally(() => {    isLoading = false})
          let isLoading = true
sendForm().then((res) => {
    alert('ok')
}).catch((err) => {
    alert(`Ошибка: ${err.message}`)
}).finally(() => {
    isLoading = false
})