try...catch

Przechwytuje błędy rzucone w bloku try i obsługuje je w catch. Opcjonalny finally wykona się zawsze.

Na tej stronie

Przykład
Definicja i zastosowanie
Składnia
Więcej przykładów
Obsługa przeglądarek
Dobre praktyki
Powiązane hasła

Przykład

JavaScript

function parseProfile(json) {
  try {
    const profile = JSON.parse(json)
    return `Witaj, ${profile.name}!`
  } catch (error) {
    return `Błędne dane: ${error.name}`
  }
}

console.log(parseProfile('{"name":"Ania"}'))
console.log(parseProfile('{name: Ania}'))

Konsola

Witaj, Ania!

Błędne dane: SyntaxError

Definicja i zastosowanie

Kod, który może rzucić błąd, umieszczasz w bloku try. Jeśli coś pójdzie nie tak, wykonanie przerywa się w miejscu błędu i przechodzi do catch, który dostaje obiekt błędu. Program działa dalej, zamiast zatrzymać się z komunikatem w konsoli.

Blok finally wykonuje się zawsze: po udanym try, po obsłużonym błędzie, a nawet wtedy, gdy w środku padło return. To dobre miejsce na sprzątanie, np. ukrycie wskaźnika ładowania. Jeśli obiekt błędu nie jest Ci potrzebny, możesz pominąć nawias: catch { }.

try...catch łapie błędy synchroniczne oraz te z await wewnątrz funkcji async. Nie złapie błędu z callbacka, który uruchomi się później, np. w setTimeout(). Łap tylko błędy, które potrafisz sensownie obsłużyć, a pozostałe przekazuj dalej przez throw.

Składnia

try {
  // kod, który może rzucić błąd
} catch (error) {
  // obsługa błędu
} finally {
  // wykona się zawsze
}

Więcej przykładów

finally wykonuje się zawsze

JavaScript

function loadLesson(id) {
  console.log('Ładowanie...')
  try {
    if (id < 1) {
      throw new Error('Nieprawidłowe id')
    }
    return `Lekcja ${id}`
  } catch (error) {
    return error.message
  } finally {
    console.log('Koniec ładowania')
  }
}

console.log(loadLesson(3))
console.log(loadLesson(0))

Konsola

Ładowanie...

Koniec ładowania

Lekcja 3

Ładowanie...

Koniec ładowania

Nieprawidłowe id

Błędy z await

JavaScript

async function fetchScore() {
  throw new Error('Serwer niedostępny')
}

async function showScore() {
  try {
    const score = await fetchScore()
    console.log(score)
  } catch (error) {
    console.log('Nie udało się:', error.message)
  }
}

await showScore()

Konsola

Nie udało się: Serwer niedostępny

Rozpoznawanie rodzaju błędu

JavaScript

try {
  const user = null
  console.log(user.name)
} catch (error) {
  if (error instanceof TypeError) {
    console.log('Brak użytkownika')
  } else {
    throw error
  }
}

Konsola

Brak użytkownika

Obsługa przeglądarek

Szeroko dostępne

Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.

Chrome
Edge
Firefox
Safari

Dobre praktyki

Nie zostawiaj pustego catch. Błąd połknięty bez śladu to godziny szukania przyczyny. Przynajmniej zapisz go przez console.error().
Obejmuj blokiem try tylko fragment, który może zawieść, np. JSON.parse() albo fetch(), a nie cały program.
Treść błędów rzucanych przez silnik (np. przy odczycie z null) różni się między przeglądarkami. W logice programu sprawdzaj error.name lub instanceof, a nie error.message.

Powiązane hasła

Widzisz błąd albo brakuje przykładu? Napisz do nas.

Darmowy kursPrzećwicz JavaScript w kursie JavaScript i ReactZadania z podpowiedziami, edytor kodu i postępy zapisywane na bieżąco.Zobacz kurs