Načrtovanje in razvoj spletnih aplikacij

JavaScript razhroščevanje (Debugging)

JavaScript koda lahko vsebuje sintaktične ali sematične napake, ki jih je težko diagnosticirati. Napake je težko odkriti, saj navadno ni nobenih sporočil napak in namigov, kje se napake nahajajo.

Ko pišemo novo kodo v JavaScriptu se običajno v njej pojavijo tudi napake, ki jih je težko diagnosticirati in locirati.

JavaScript razhroščevalniki

Iskanje in odpravljanje napak v programski kodi imenujemo razhroščevanje (angl. Debugging). Razhroščevanje programske kode JavaScript ni preprosto, na srečo pa ima večina modernih brskalnikov vgrajen razhroščevalnik, ki ga lahko vključimo ali izljučimo.

Običajno razhroščevalnik v brskalnikih zaženemo s funkcijsko tipko F12.

Metoda console.log()

V primeru, da brskalnik podpira razhroščevanje, lahko za prikaz vrednosti spremenljivk JavaScript v oknu razhroščevalnika uporabimo metodo console.log().

<p>Preprost izračun:</p>
<p id="primer"></p>
<script> 
   x = 10; 
   y = 20; 
   z = x + y; 
   console.log(z);
   document.getElementById("primer").innerHTML = "Vrednost spremenljivke z je " + z; 
</script>

Preprost izračun:

Nastavitev prekinitvene točke

V oknu razhroščevalnika lahko nastavimo tudi prekinitvene točke, kjer se ustavi izvajanje programske kode in lahko preučimo vrednosti spremenljivk.

Izvajanje kode nadaljujemo s pritiskom na tipko Play (običajno v večini brskalnikov).

Rezervirana beseda debugger

Rezervirana beseda debugger ustavi izvajanje JavaScripta in pokliče razhroščevalno funkcijo, če je le ta na voljo. debugger ima enako funkcijo, kot prekinitvene točke v razhroščevalniku. Če razhroščevalnik ni na voljo, rezervirana beseda debugger nima nobenega pomena.

<p>Primer uporabe rezervirane besede debugger:</p>
<p id="primer"></p>
<script> 
   x = 10; 
   y = 20; 
   z = x + y; 
   debugger;
   document.getElementById("primer").innerHTML = "Vrednost spremenljivke z je " + z; 
</script>

Primer uporabe rezervirane besede debugger:

Če je razhroščevalnik na voljo, se bo ta koda ustavila preden se bo izvedla četrta vrstica kode.