Как вы работаете с асинхронным JavaScript?

С асинхронностью в JavaScript работаю с использованием коллбэков, промисов и async/await.

Коллбэки – это функции, которые передаются в другие функции в качестве аргументов и выполняются после завершения какой-либо операции. Могут приводить к "адскому коллбэков" при вложенности.

// Пример коллбэка
function fetchData(callback) {
  setTimeout(() => {
    callback("Данные получены");
  }, 1000);
}

fetchData((data) => {
  console.log(data); // Выведет "Данные получены" через 1 секунду
});

Промисы – объекты, представляющие конечное завершение или неудачу асинхронной операции. Упрощают работу с асинхронным кодом, позволяют избежать глубокой вложенности. Имеют три состояния: pending (ожидание), fulfilled (выполнено успешно), rejected (отклонено).

// Пример промиса
function fetchDataPromise() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Данные получены");
    }, 1000);
  });
}

fetchDataPromise()
  .then((data) => {
    console.log(data); // Выведет "Данные получены" через 1 секунду
  })
  .catch((error) => {
    console.error("Ошибка:", error);
  });

Async/await – синтаксический сахар над промисами, который делает асинхронный код более читаемым, похожим на синхронный. Функция, помеченная async, всегда возвращает промис. Оператор await может использоваться только внутри async функции и приостанавливает выполнение до тех пор, пока промис не будет выполнен (resolved) или отклонен (rejected).

// Пример async/await
async function fetchDataAsync() {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Данные получены");
    }, 1000);
  });
}

async function processData() {
  try {
    const data = await fetchDataAsync();
    console.log(data); // Выведет "Данные получены" через 1 секунду
  } catch (error) {
    console.error("Ошибка:", error);
  }
}

processData();

Часто использую async/await при работе с API-запросами, так как это наиболее удобный и читаемый способ обработки асинхронных операций. При необходимости параллельного выполнения нескольких асинхронных операций использую Promise.all() или Promise.allSettled().

Использую event loop для понимания порядка выполнения асинхронного кода, микротасков и макротасков.