Элегантное решение: Promise.finally() для очистки в JavaScript

Как разработчики, мы часто сталкиваемся с асинхронными операциями в JavaScript, будь то получение данных из API, взаимодействие с файловой системой или обработка пользовательских событий. Хотя промисы значительно упростили управление асинхронным кодом, все еще существуют сценарии, в которых нам необходимо выполнять операции очистки независимо от того, выполнен промис или нет.

Именно здесь на помощь приходит Promise.finally(), предлагающая элегантное решение для выполнения кода после выполнения промиса. Прежде чем мы погрузимся в детали, давайте рассмотрим практический пример. Представьте, что вы создаете веб-приложение, которое получает данные из внешнего API.

Во время процесса получения данных вы, возможно, захотите отобразить пользователю индикатор загрузки. Как только данные будут получены (или произойдет ошибка), вы захотите скрыть индикатор загрузки. Это идеальный случай использования Promise.finally().

function fetchData() {
  showLoadingIndicator();

  fetch('/api/data')
    .then(response => response.json())
    .then(data => {
      // Process the fetched data
      console.log(data);
    })
    .catch(error => {
      // Handle any errors
      console.error('Error:', error);
    })
    .finally(() => {
      // This code will run regardless of the promise's outcome
      hideLoadingIndicator();
    });
}

В этом примере мы сначала вызываем функцию showLoadingIndicator(), чтобы отобразить пользователю индикатор загрузки. Затем мы используем API fetch для получения данных из внешнего API. Независимо от успеха или неудачи операции fetch, код внутри блока finally будет выполнен, что позволит нам вызвать функцию hideLoadingIndicator() и убрать индикатор загрузки из пользовательского интерфейса.

Метод Promise.finally() - это относительно новое дополнение к языку JavaScript, появившееся в ECMAScript 2018 (ES9). В качестве аргумента он принимает функцию обратного вызова, которая будет выполнена по завершении выполнения промиса, независимо от того, был ли он выполнен или отклонён. Вот еще один пример, демонстрирующий, как Promise.finally() можно использовать для операций очистки:

function readFile(filePath) {
  const fileStream = openFileStream(filePath);

  return new Promise((resolve, reject) => {
    fileStream.on('data', data => {
      // Process the file data
      resolve(data);
    });

    fileStream.on('error', error => {
      reject(error);
    });
  })
  .finally(() => {
    // This code will run regardless of the promise's outcome
    fileStream.close();
  });
}

В этом примере мы определяем функцию readFile, которая открывает файловый поток и возвращает промис. Промис выполняется с данными файла, если файл прочитан успешно, или отклоняется с ошибкой, если возникли проблемы. Независимо от результата, блок finally обеспечивает закрытие файлового потока, предотвращая утечку ресурсов.

Важно отметить, что обратный вызов finally не является заменой блока catch. Если ошибка произойдет внутри самого обратного вызова finally, она будет выброшена и, возможно, не будет обработана. Поэтому рекомендуется использовать finally для операций очистки и обрабатывать ошибки в блоке catch.

fetchData()
  .catch(error => {
    // Handle any errors
    console.error('Error:', error);
  })
  .finally(() => {
    // Cleanup operations
    hideLoadingIndicator();
  });

Комбинируя catch и finally, вы можете обеспечить правильную обработку ошибок и при этом выполнить необходимые операции очистки.

В заключение следует отметить, что Promise.finally() - это мощное и элегантное решение для выполнения операций очистки в JavaScript, независимо от того, выполнен промис или нет. Используя эту функцию, вы сможете писать более надежный и поддерживаемый асинхронный код, обеспечивая правильное управление ресурсами и плавное и последовательное взаимодействие с пользователем.

Для перехода к источнику нажмите здесь. Для загрузки страницы требуется VPN.