JS оператор try...catch

Загальний опис

try...catch — це конструкція в JavaScript, яка дозволяє обробляти помилки, що виникають під час виконання коду в блоці try. Якщо у блоці try виникає помилка, виконання припиняється, і управління передається в блок catch, де можна обробити цю помилку. Це дозволяє уникнути аварійного завершення програми.

Основи використання:

У блоці try розміщується код, який може викликати помилки. Якщо в коді виникає помилка, її можна перехопити в блоці catch, де ми отримуємо деталі помилки через параметр (найчастіше це error або e).

try {
  let result = someFunction();
} catch (error) {
  console.error("Помилка:", error.message);
}

У цьому прикладі, якщо someFunction() викликає помилку, її буде оброблено в блоці catch.

Важливі моменти:

1. Ловлення помилок: Використовуйте конструкцію для безпечного виконання коду, який може викликати помилки, наприклад, робота з API або обчисленням чисел.
2. Обробка помилок: У блоці catch можна виконати додаткові дії, такі як виведення повідомлення про помилку, спроба перезапуску процесу або запис помилки в лог.
3. Робота з асинхронним кодом: У асинхронних функціях можна поєднувати try...catch з async...await для ефективної обробки помилок.

async function fetchData(url) {
  try {
    let response = await fetch(url);
    if (!response.ok) throw new Error("Помилка з'єднання");
    let data = await response.json();
    return data;
  } catch (error) {
    console.error("Помилка при завантаженні даних:", error.message);
  }
}

Тут помилки, що виникають під час запиту або обробки відповіді, будуть перехоплені і оброблені в блоці catch.

правити

Порада

Ніколи не ігноруйте помилки, якщо вони виникають, а особливо в асинхронних функціях. Помилки можуть мати серйозні наслідки, тому їх потрібно обробляти або хоча б логувати для подальшого аналізу.

автор: Bond правити

Порада

Інколи має сенс використовувати finally разом з try...catch. Блок finally виконується завжди, незалежно від того, чи сталася помилка. Це корисно, коли потрібно очистити ресурси, наприклад, закрити відкриті файли або з'єднання.

автор: Bond правити

Порада

Задавайте більш детальні повідомлення про помилки в блоках catch. Використовуйте властивість error.stack, щоб відстежити стек викликів, який дасть більше контексту і допоможе швидше знайти місце виникнення проблеми.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

try {
  // код, який може викликати помилку
} catch (error) {
  // код обробки помилки
}

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	1	1	1	4	12

Підтримка: мобільні переглядачі

Переглядач
	4.4	18	4	1

Підтримка: серверні переглядачі

Переглядач
	0.10.0	1.0

Приклади

+ запропонувати свій приклад у пісочниці

const items = [1, 2, 3, null, 4, 5];

for (let i = 0; i < items.length; i++) {
  try {
    console.log("Обробка елемента:", items[i].toString());
  } catch (error) {
    console.error(`Помилка при обробці елемента на індексі ${i}:`, error.message);
  }
}

async function fetchUserData(userId) {
  try {
    const response = await fetch(`https://api.example.com/users/${userId}`);
    if (!response.ok) throw new Error("Користувач не знайдений");
    const userData = await response.json();
    console.log(userData);
  } catch (error) {
    console.error("Помилка при отриманні даних користувача:", error.message);
  }
}

fetchUserData(123);