Асинхронные операции — неотъемлемая часть современной веб-разработки. Однако иногда эти операции могут занимать больше времени, чем ожидалось, что приводит к проблемам с производительностью или даже к блокировке потока выполнения. Чтобы решить эту проблему, обычно используются тайм-ауты, устанавливающие ограничение на продолжительность операции. В этой статье мы рассмотрим несколько методов таймаута в TypeScript с примерами кода для эффективной обработки асинхронных операций.

Метод 1: setTimeout
Один из самых простых способов реализовать тайм-аут в TypeScript — использовать функцию setTimeout. Он позволяет выполнить функцию обратного вызова после указанной задержки в миллисекундах. Вот пример:

function performAsyncOperation(): Promise<string> {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Operation completed successfully!');
    }, 5000); // Set the timeout to 5 seconds
  });
}

Метод 2: промисифицировать setTimeout
Чтобы сделать механизм тайм-аута более многоразовым и последовательным, мы можем создать служебную функцию, которая промисифицирует setTimeout. Это позволяет нам использовать обещания и синтаксис async/await. Вот пример:

function delay(ms: number): Promise<void> {
  return new Promise((resolve) => setTimeout(resolve, ms));
}
async function performAsyncOperation(): Promise<string> {
  await delay(5000); // Set the timeout to 5 seconds
  return 'Operation completed successfully!';
}

Метод 3: обещание с помощью axios
Если вы работаете с асинхронными операциями, включающими вызовы внешних API, вы можете объединить предыдущий метод с популярной библиотекой HTTP, такой как Axios. Вот пример:

import axios, { AxiosPromise } from 'axios';
function delay(ms: number): Promise<void> {
  return new Promise((resolve) => setTimeout(resolve, ms));
}
async function performHttpRequest(): Promise<any> {
  const requestPromise: AxiosPromise<any> = axios.get('https://api.example.com/data');

  const timeoutPromise: Promise<any> = delay(5000); // Set the timeout to 5 seconds

  return Promise.race([requestPromise, timeoutPromise]);
}
performHttpRequest()
  .then((response) => {
    // Handle successful response
  })
  .catch((error) => {
    if (axios.isCancel(error)) {
      // Handle timeout error
    } else {
      // Handle other errors
    }
  });

Тайм-ауты полезны для эффективного управления асинхронными операциями. В этой статье мы рассмотрели три различных метода реализации таймаутов в TypeScript. Функция setTimeoutобеспечивает базовый механизм тайм-аута, а обещанная версия позволяет более упростить обработку ошибок. Объединение обещанных таймаутов с такими библиотеками, как Axios, еще больше расширяет возможности таймаутов, особенно при работе с внешними вызовами API. Используя эти методы, разработчики могут гарантировать, что их приложения корректно обрабатывают асинхронные операции в заданные сроки.