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

↑ 1.4 JavaScript: основы · ← Предыдущая · → Следующая

Желательно~3 мин чтенияУровень: junior

Зачем это на собесе

Как правильно бросать и ловить ошибки, особенно в асинхронном коде и на уровне приложения.

Объяснение

try {
  const data = JSON.parse(text);
  await save(data);
} catch (err) {
  if (err instanceof SyntaxError) showMessage("Некорректный JSON");
  else throw err;                   // неизвестное — пробрасываем
} finally {
  hideLoader();                     // выполняется всегда
}
 
class ApiError extends Error {
  constructor(message, { status, code, cause } = {}) {
    super(message, { cause });
    this.name = "ApiError"; this.status = status; this.code = code;
  }
}
throw new ApiError("Не найдено", { status: 404 });

Тип	Причина
Error	базовый
TypeError	неверный тип/undefined.x
ReferenceError	необъявленная переменная
SyntaxError	синтаксис, JSON.parse
RangeError	значение вне диапазона, переполнение стека
AggregateError	несколько ошибок (Promise.any)

Асинхронные ошибки:

• В Promise — .catch() или try/await/catch.
• try/catch не ловит ошибки внутри асинхронных коллбэков setTimeout.
• Глобальные: window.onerror, window.addEventListener("unhandledrejection", …).

window.addEventListener("unhandledrejection", (e) => report(e.reason));
const results = await Promise.allSettled(tasks);      // не падает из-за одной ошибки

Практики: единая обработка ошибок HTTP (интерсептор), понятные сообщения пользователю, логирование (Sentry) с контекстом, cause для цепочки причин, не глотать ошибки (catch {}), не использовать исключения для обычного потока.

Во Vue: errorCaptured, app.config.errorHandler; ErrorBoundary-подобные компоненты.

Нюансы и подводные камни

• throw строки/объектов — плохо: теряется стек; бросайте Error.
• fetch не бросает ошибку на 4xx/5xx.
• finally с return переопределяет результат.
• Без await внутри try промис не будет пойман.
• Слишком общий catch скрывает баги.

Практика

1. Создайте иерархию ошибок API и единый обработчик.
2. Настройте глобальные обработчики и отправку в Sentry.
3. Обработайте Promise.allSettled с частичными ошибками.

Вопросы с ответами

Ловит ли try/catch ошибки в setTimeout?

Нет: коллбэк выполняется позже; обработку нужно ставить внутри коллбэка.

Как поймать необработанные ошибки промисов?

Событие unhandledrejection и .catch на цепочках.

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

• DOM и события: всплытие, погружение, делегирование
• Модули: ESM и CommonJS