Управление задержкой в ​​TypeScript: подробное руководство по обработке асинхронных операций

  1. setTimeout():
    Один из самых простых способов ввести задержку — использовать встроенную функцию setTimeout(). Он позволяет выполнить фрагмент кода через заданный интервал времени, измеряемый в миллисекундах. Вот пример:
console.log("Hello");
setTimeout(() => {
  console.log("Delayed message");
}, 2000);
console.log("World");

В этом примере «Привет» и «Мир» будут записаны сразу, а «Отложенное сообщение» — после двухсекундной задержки.

  1. Обещания с помощью setTimeout():
    Обещания обеспечивают более структурированный подход к обработке задержек. Мы можем обернуть setTimeout()внутри обещания, чтобы создать отложенное выполнение. Вот пример:
function delay(milliseconds: number): Promise<void> {
  return new Promise((resolve) => {
    setTimeout(resolve, milliseconds);
  });
}
console.log("Hello");
delay(2000).then(() => {
  console.log("Delayed message");
});
console.log("World");

Этот код выдаст тот же результат, что и предыдущий пример, но с более явным потоком управления с использованием обещаний.

  1. async/await с помощью setTimeout():
    С помощью синтаксиса async/await TypeScript мы можем еще больше упростить обработку задержек. Пометив функцию как async, мы можем использовать awaitдля приостановки выполнения до тех пор, пока не истечет указанная задержка. Вот пример:
async function delay(milliseconds: number): Promise<void> {
  await new Promise((resolve) => {
    setTimeout(resolve, milliseconds);
  });
}
async function delayedLog() {
  console.log("Hello");
  await delay(2000);
  console.log("Delayed message");
  console.log("World");
}
delayedLog();

Этот код регистрирует «Привет», вводит 2-секундную задержку, а затем последовательно регистрирует «Отложенное сообщение» и «Мир».

  1. Использование таймеров.
    Помимо setTimeout(), TypeScript предоставляет другие функции, связанные с таймерами, например setInterval()и requestAnimationFrame(). Эти функции можно использовать для введения повторяющихся или покадровых задержек, в зависимости от ваших конкретных требований.

В этой статье мы рассмотрели различные методы введения задержек в TypeScript. Мы рассмотрели использование setTimeout(), Promises, синтаксиса async/await и других функций, связанных с таймером. Освоив эти методы, вы получите мощный арсенал для эффективной обработки асинхронных операций в ваших проектах TypeScript.

Помните, что задержки — важный аспект создания адаптивных и эффективных приложений. Так что экспериментируйте с разными подходами и выбирайте тот, который лучше всего соответствует вашим потребностям.