Обработка ошибок: try...catch, reject, catch()

Когда всё идёт не так: ловим ошибки в JavaScript 🎣

JavaScript — как капризный друг: иногда он делает именно то, что вы просите, а иногда… выдаёт что-то неожиданное. ⚡️ Разберёмся, как предугадывать проблемы и обрабатывать ошибки, чтобы код не ломался в самый неподходящий момент.


try...catch: спасательный круг для синхронного кода

Когда код выполняется последовательно (синхронно), ошибки можно поймать конструкцией try...catch.

try {
  // Потенциально опасный код
  const result = riskyOperation();
  console.log(result);
} catch (error) {
  // Если что-то пошло не так — выполнится это
  console.error('Ой, ошибка!', error.message);
} finally {
  // Этот блок выполнится в любом случае
  console.log('Уборка завершена! 🧹');
}

Что здесь происходит?

  • try — пробуем выполнить код.
  • catch — ловим ошибку, если она возникла.
  • finally — выполняем обязательные действия (например, закрываем соединение).

💡 Совет: finally идеален для «уборки» (закрытие файлов, очистка временных данных).


throw: создаём ошибки вручную

Иногда нужно прервать выполнение и сообщить, что что-то пошло не так.

function divide(a, b) {
  if (b === 0) {
    throw new Error('Делить на ноль нельзя! 🔥');
  }
  return a / b;
}

try {
  divide(10, 0);
} catch (error) {
  console.error(error.message); // "Делить на ноль нельзя! 🔥"
}

Асинхронные ошибки: Promise.reject и catch()

Асинхронный код (например, запросы к API) требует другого подхода.

Вариант 1: Promise.reject

Если операция завершилась неудачно, можно вернуть отклонённый промис.

function fetchData() {
  return new Promise((resolve, reject) => {
    // Эмулируем ошибку
    const isSuccess = Math.random() > 0.5;
    if (!isSuccess) {
      reject('Сервер не отвечает 🚨');
    } else {
      resolve('Данные получены! ✅');
    }
  });
}

Вариант 2: .catch()

Ловим ошибки в цепочке промисов.

fetchData()
  .then((data) => {
    console.log(data);
  })
  .catch((error) => {
    console.error('Ошибка:', error); // "Сервер не отвечает 🚨"
  })
  .finally(() => {
    console.log('Операция завершена.'); // Выполнится всегда
  });

async/await + try...catch: элегантная асинхронность

Если вы используете async/await, ошибки можно ловить так же, как в синхронном коде.

async function loadUserData() {
  try {
    const response = await fetch('https://api.example.com/user');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error('Не удалось загрузить данные:', error);
  } finally {
    console.log('Завершено!');
  }
}

🔥 Важно: Без try...catch необработанные ошибки в async-функциях «провалятся» и могут сломать приложение.


Сравнение подходов

Метод Где работает Особенности
try...catch Синхронный код Ловит только синхронные ошибки
.catch() Промисы Работает с асинхронными операциями
async/await + try...catch Асинхронный код Удобен для цепочек await

Итог: как не утонуть в ошибках

  • Синхронные операцииtry...catch.
  • Промисы.catch() или try...catch внутри async/await.
  • Важные завершающие действияfinally.

Теперь ваш код стал устойчивее, а ошибки — предсказуемее. 🚀 Вперёд, к надёжному коду!

Скрыть рекламу навсегда

🧠 Учёба без воды и зубрёжки

Закрытый Boosty с наработками опытного преподавателя.

Объясняю сложное так, чтобы щелкнуло.

🚀 Забрать доступ к Boosty