JavaScript · асинхронность

Async и await

async и await позволяют читать асинхронный код почти как последовательный. Async-функция всегда возвращает Promise, даже если вернуть обычное значение.

Ожидание результата

await приостанавливает только текущую async-функцию, а не весь браузер. После выполнения Promise код продолжится со следующей строки.

async function loadUser() {
  const response = await fetch('/api/user');
  const user = await response.json();
  return user;
}

Обработка ошибок

Отклонённый Promise превращается в исключение, которое можно поймать через try...catch. Для fetch отдельно проверь response.ok.

async function loadData() {
  try {
    const response = await fetch('/api/data');
    if (!response.ok) throw new Error(`HTTP ${response.status}`);
    return await response.json();
  } catch (error) {
    console.error(error);
    throw error;
  }
}

Параллельные запросы

Если операции не зависят друг от друга, последовательные await зря увеличивают ожидание. Запусти Promise одновременно и дождись их через Promise.all.

const [user, posts] = await Promise.all([
  fetch('/api/user').then(r => r.json()),
  fetch('/api/posts').then(r => r.json())
]);

Частые ошибки

• Забывать async у функции.
• Последовательно ждать независимые запросы.
• Не показывать состояние загрузки.
• Проглатывать ошибку без сообщения или повторного throw.

Связанные темы

Fetch API · try...catch · Функции