Najnowsze tutoriale tworzenie stron internetowych
 

JavaScript Debugowanie


Łatwo jest zgubić pisania kodu JavaScript bez debuggera.


Debugowanie JavaScript

Trudno jest napisać kod JavaScriptu bez debuggera.

Kod może zawierać błędy składniowe lub błędy logiczne, które są trudne do zdiagnozowania.

Często, gdy kod JavaScript zawiera błędy, nic się nie stanie. Nie ma żadnych komunikatów o błędach, a dostaniesz żadnych wskazówek gdzie szukać błędów.

Normalnie będą pojawiały się błędy, za każdym razem staram się napisać nowy kod JavaScript.


Debuggers JavaScript

Wyszukiwanie błędów w kodzie programowania nazywa debugowanie kodu.

Debugowanie nie jest łatwe. Ale na szczęście, wszystkie nowoczesne przeglądarki mają wbudowany debugger.

Wbudowane debugery mogą być włączane i wyłączane, zmuszając błędy należy zgłaszać do użytkownika.

Z debuggera, można również ustawić punkty przerwania (miejsca, gdzie wykonanie kodu może być zatrzymany), i zbadać zmienne natomiast kod jest wykonywany.

Normalnie, w przeciwnym wypadku postępuj zgodnie z instrukcjami na dole tej strony, należy włączyć debugowanie w przeglądarce za pomocą klawisza F12 i wybierz "Konsola" w menu debuggera.


console.log() Metoda

Jeżeli Twoja przeglądarka obsługuje debugowania, można użyć console.log() do wyświetlania wartości JavaScript w oknie debugera:

Przykład

<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>

<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>

</body>
</html>
Spróbuj sam "

Ustawianie Breakpoints

W oknie debuggera, można ustawić punkty przerwania w kodzie JavaScript.

Na każdym przerwania, JavaScript zatrzyma wykonywanie i pozwala badać wartości JavaScript.

Po zbadaniu wartości, można wznowić wykonywanie kodu (zazwyczaj za pomocą przycisku PLAY).


Debuger słowo

Słowo kluczowe debugger zatrzymuje wykonanie JavaScript i połączenia (jeśli są dostępne) funkcję debugowania.

Ma to taką samą funkcję jak ustawienie przerwania w debuggera.

Jeśli nie jest dostępny debugowania, debugger oświadczenie nie ma wpływu.

Z debugger włączony, kod ten spowoduje zatrzymanie wykonywania zanim wykona trzecią linię.

Przykład

var x = 15 * 5;
debugger;
document.getElementbyId("demo").innerHTML = x;
Spróbuj sam "

Debugging Tools głównych przeglądarek '

Normalnie aktywować debugowanie w przeglądarce z F12 i wybierz "Konsola" w menu debuggera.

W przeciwnym razie wykonaj następujące kroki:

Chrome

  • Otwórz przeglądarkę.
  • Z menu wybierz Narzędzia.
  • Od narzędzi, wybrać narzędzia programistyczne.
  • Na koniec wybierz Console.

Firefox Firebug

  • Otwórz przeglądarkę.
  • Przejdź do strony:
    http://www.getfirebug.com
  • Postępuj zgodnie z instrukcjami, jak:
    zainstalować Firebug

Internet Explorer

  • Otwórz przeglądarkę.
  • Z menu wybierz Narzędzia.
  • Od narzędzi, wybrać narzędzia programistyczne.
  • Na koniec wybierz Console.

Opera

  • Otwórz przeglądarkę.
  • Przejdź do strony:
    http://dev.opera.com
  • Postępuj zgodnie z instrukcjami, jak:
    dodać przycisk Konsoli programisty do paska narzędzi.

Safari Firebug

  • Otwórz przeglądarkę.
  • Przejdź do strony:
    http://extensions.apple.com
  • Postępuj zgodnie z instrukcjami, jak:
    zainstalować Firebug Lite.

Safari Develop Menu

  • Idź do Safari, Preferencje, Zaawansowane w menu głównym.
  • Zaznacz "Włącz Pokaż menu w pasku menu Develop".
  • Gdy nowa opcja "Develop" pojawi się w menu:
    Wybierz "Pokaż Konsola błędów".

Czy wiedziałeś?

Debugowanie to proces testowania, znajdowanie i zmniejszenie błędów (błędy) w programach komputerowych.
Pierwszy znany komputer bug był prawdziwy błąd (owada) tkwi w elektronice.