Debugowanie to proces identyfikacji i naprawy błędów w kodzie. Istnieje wiele narzędzi i metod wspomagających debugowanie w JavaScript.

1. Konsola w przeglądarce

Przeglądarki internetowe, takie jak Google Chrome czy Firefox, oferują wbudowane narzędzia developerskie, które umożliwiają debugowanie kodu.

• console.log() – Wypisuje dane w konsoli, co pozwala na śledzenie wartości zmiennych.

const liczba = 42;
console.log("Wartość liczby:", liczba); // Wartość liczby: 42

• console.error() – Używane do wypisywania błędów.

console.error("Coś poszło nie tak!");

• console.table() – Tworzy czytelną tabelę w konsoli.

const osoby = [
  { imie: "Jan", wiek: 30 },
  { imie: "Anna", wiek: 25 }
];
console.table(osoby);

2. Debugger

Narzędzie debugger umożliwia przerywanie wykonywania kodu w określonym miejscu i analizowanie stanu aplikacji.

• Ustawienie punktu przerwania w kodzie:

const liczba = 10;
debugger; // Zatrzymanie kodu tutaj w narzędziach deweloperskich
console.log(liczba);

• W przeglądarce możesz również kliknąć numer linii w narzędziach deweloperskich, aby ustawić punkt przerwania.

3. Try…catch

Obsługuje błędy w trakcie wykonywania kodu, zapobiegając jego przerwaniu.

try {
  const wynik = 10 / 0; // Nie spowoduje błędu, ale np. parsowanie JSON może
  console.log("Wynik:", wynik);

  const json = '{"imie":"Jan", "wiek":30}';
  const dane = JSON.parse(json); // Poprawny JSON
  console.log(dane);

  // Błąd w JSON
  const niepoprawnyJson = '{"imie":"Anna", wiek:25}';
  const dane2 = JSON.parse(niepoprawnyJson);
} catch (error) {
  console.error("Wystąpił błąd:", error.message);
}