> Как отлаживать ошибки в коде (JavaScript)

Короткий ответ

Отладка ошибок в JavaScript/Node.js начинается с чтения stack trace и использования console.log или debugger. Для сложных случаев применяю Chrome DevTools, VS Code debugger, а для Node.js - --inspect флаг. Важно воспроизвести ошибку изолированно, проверить типы данных и асинхронные цепочки. Использую source maps для продакшена, логирование через Winston/Sentry и unit-тесты для регрессии.

Подробное объяснение

Процесс отладки включает несколько этапов. Сначала анализирую сообщение об ошибке и stack trace - это даёт строку кода и последовательность вызовов. Затем воспроизвожу ошибку в контролируемой среде, часто с минимальным набором данных. Для frontend использую breakpoints в Chrome DevTools: conditional breakpoints, watch expressions, call stack. Для Node.js запускаю с node --inspect-brk и подключаюсь через Chrome DevTools или использую встроенный debugger в VS Code.

Асинхронные ошибки - отдельная сложность. В промисах всегда добавляю .catch() или использую try/catch с async/await. Для event emitters слушаю uncaughtException и unhandledRejection. В продакшене подключаю Sentry или аналоги для сбора ошибок с контекстом (user agent, actions, state). Source maps позволяют видеть оригинальный код, а не минифицированный.

Для трудноуловимых багов применяю:

• console.trace() для трассировки вызовов
• performance.mark() и performance.measure() для замеров
• логирование с уровнями (debug, info, error) через Winston
• unit-тесты на граничные случаи

На практике

Начинаю с воспроизведения: открываю консоль браузера или терминал, смотрю точное сообщение. Если ошибка в UI, проверяю React DevTools или Vue DevTools для состояния компонентов. Для Node.js API - использую Postman или curl с теми же заголовками.

Типичный сценарий: ошибка "Cannot read property of undefined". Смотрю stack trace, нахожу строку, ставлю breakpoint на несколько строк выше. Проверяю, что приходит в функцию, через console.log или watch. Если асинхронно - проверяю, не потерялся ли контекст (this) или не undefined ли ответ от сервера.

Для сетевых ошибок в браузере открываю вкладку Network, смотрю статусы и тело ответа. В Node.js - логирую request/response через middleware (например, morgan). Если баг связан с race condition, добавляю логи с таймстемпами.

Пример кода

JAVASCRIPT
// Пример отладки асинхронной ошибки в Node.js
async function fetchUserData(userId) {
  try {
    const response = await fetch(`/api/users/${userId}`);
    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }
    const data = await response.json();
    return data;
  } catch (error) {
    console.error('fetchUserData failed:', error.message);
    console.trace('Stack trace:');
    // Логируем в Sentry
    Sentry.captureException(error, { extra: { userId } });
    throw error; // или возвращаем fallback
  }
}

// Использование debugger в VS Code
function processItems(items) {
  debugger; // breakpoint
  const result = items.map(item => {
    // conditional breakpoint: item.id === 42
    return transform(item);
  });
  return result;
}

Как отвечать на собеседовании

Покажите системный подход: не просто "ставлю console.log", а описываете процесс от начала (чтение ошибки) до конца (фикс и тест). Упомяните инструменты: Chrome DevTools, VS Code debugger, Sentry, source maps. Для senior важно рассказать про отладку в production: feature flags, логирование с контекстом, A/B тесты для проверки фикса.

Акцентируйте внимание на асинхронных ошибках и race conditions - это частая проблема. Приведите пример, как вы отлаживали баг с гонкой данных. Покажите, что умеете не только фиксить, но и предотвращать ошибки через типизацию (TypeScript), линтеры и code review.

Что проверяет интервьюер

• Умение читать stack trace и понимать поток выполнения
• Знание инструментов отладки для frontend и Node.js
• Понимание асинхронности и обработки ошибок в промисах/callbacks
• Навыки работы с production-логированием и мониторингом
• Способность воспроизводить и изолировать сложные баги
• Понимание разницы между dev и prod отладкой

Типичные ошибки

• Игнорирование stack trace и попытки угадать причину
• Использование только console.log без breakpoints и watch
• Забывание про source maps в production - ошибки указывают на минифицированный код
• Неправильная обработка асинхронных ошибок: отсутствие .catch() или try/catch
• Отладка в production без изоляции - можно сломать пользователям
• Слишком много логов, которые засоряют консоль и замедляют приложение
• Не учитывать race conditions при параллельных запросах