Сталкивались ли вы когда-нибудь с такой проблемой в своей обычной работе: вам нужно отправить сетевой запрос, но независимо от того, успешно он или нет, вам необходимо выполнить некоторые работы по очистке, например, скрыть анимацию загрузки.

Вам может быть интересно, предоставляет ли JS механизм, который позволяет вам выполнять некоторую логику кода во время асинхронных операций, независимо от успеха или неудачи?

Ответ, конечно, да — finally метод Promise.

Промисы — это решение для обработки асинхронных операций в JS, которое позволяет нам элегантно и предсказуемо обрабатывать результаты и ошибки асинхронных операций. finally method — это механизм, предоставляемый Promises — независимо от того, будет ли асинхронная операция успешной или неудачной, будет выполнен finally method.

Однако задумывались ли вы когда-нибудь, как реализован этот finally метод? Как это гарантирует, что указанный код будет выполнен независимо от результата промиса?

Чтобы ответить на два вопроса выше, во-первых, вам нужно иметь общее представление о обещаниях.

Если вы уже знакомы с основами Promises, вы можете пропустить эту часть и сразу перейти к «реализации finally method».

Основа обещания

Промисы — это встроенный в JS объект, который обрабатывает асинхронные операции. Обещания имеют три состояния: ожидание, выполнено и отклонено.

Когда мы создаем промис, нам нужно указать в качестве аргумента функцию, которая принимает два аргумента: resolve и reject . Эти два параметра также являются функциями, которые используются для изменения состояния промиса соответственно. Когда асинхронная операция завершается успешно, мы вызываем функцию resolve и передаем результат; при сбое асинхронной операции мы вызываем функцию reject и передаем сообщение об ошибке.

Это основная концепция и использование Promise.

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

const promise = new Promise((resolve, reject) => {
  // Asynchronous operations
  if (/* Asynchronous operation successful */) {
    resolve('Successful results');
  } else {
    reject('Reasons for Failure');
  }
});

Как насчет этого, легко ли это понять в сочетании с этим фрагментом кода?