Bevezetés
A legtöbb programozási nyelvben megalkották a hibakezelés módszerét. Nem történt ez másképpen a JavaScriptben sem. Javahoz hasonló alapokra helyezték az eljárást, melynek segítségével a működő forráskódunktól elkülönítve kezelhetjük a nem kívánt eseményeket.
Sajnos csak a JavaScript 1.5 verziójától él ez a nagy segítség, addig a böngészők pop-up ablakon keresztül tudatták a számukra érthetetlen dolgokat jelentő hibákat. Az internet Explorer 5.0 és Netscape 6.0 óta sokkal könnyebb lett a fejlesztők élete.
Az eljárás lényege, hogy forráskódunk köré egy olyan figyelő rendszert állítunk, melynek segítségével könnyen lekezelhetjük (elkaphatjuk) mindazon hibákat, melyek annak futása közben keletkezik.
Szintaxis
A kivételkezelés szintaxisa a következő:
Normál esetben amikor egy JavaScript programban hiba generálódik, legyen az szintaktikai vagy logikai, akkor az kilép és a program adott helyzetében kialakul egy hiba üzenet, mely a hiba okait tartalmazza. Korábban még ezek a nyers hibaüzenetek kerültek a képernyőre, már azonban lehetőségünk van egy jóval kényelmesebb és érthetőbb formára hozásra.
Például ha egy eljárás vagy függvény megkísérel egy nem támogatott folyamatot végezni, akkor generálódik egy hiba típus és egy hozzá kapcsolódó hibaüzenet, melyet az alkalmazás elkap és eltéríti a folyamat menetét egy kivétel kezelő rutinba.
try {
// Futó program rész
} catch (error) {
// Hiba esetén lefuttatott rész
} finally {
// Minden esetben lefutó program rész
}
Ha többféle hiba fellépésére számítunk a try blokkban, akkor erre a catch esetében is fel kell készülnünk. Erre többféle szintaxissal van lehetőségünk.
-
Egy catch ággal, a catch blokkon belül elágazások a kivétel típusának megfelelően. Pl.
try{...} catch(e){ if(e instanceof ...) {...} else if (e instanceof ...) {...} ... } -
Több catch utasítás, a kivételek típusa szerint, instanceof-val megkülönböztetve (nem szabványos) Például:
try{...} catch(e if e instanceof ...) {...} catch(e if e instanceof ...) {...} -
Több catch utasítás, a kivételek neve szerint megkülönböztetve (nem szabványos) Például:
try{...} catch(e if e == "kivételnév") {...} catch(e if e == "kivételnév") {...}
Kivételek definiálása
A Javascriptben kivétel bármi lehet, nem kell, hogy a kivételek egy adott, közös őssel rendelkezzenek.
Kivételek kiváltása
A JavaScript olyan lehetőséget is kínál, hogy a catch ágon belül több hibát is lekezel különbözőképpen. Erre szolgálnak a Throw metódusok, amikor meghatározott hiba típusoknál továbbterjedés történik.
Nézzünk ismét egy példát:
<html>
<head>
<script language="JavaScript">
function checkAge() {
try {
// ha nem megengedett érték van a formon
// egy hiba üzenet generálódik
if (document.forms[0].age.value > 99) {
throw RangeError;
}
} catch (e) {
// elkap minden tovább lökött hibát és kiíratja a hiba típusát
alert(e.name);
}
}
</script>
</head>
<body>
<form>
<input type="text" name="age" onBlur="checkAge()">
</form>
</body>
</html>
Nézzünk még egy példát:
<html>
<head>
<script language="JavaScript">
// Készítsünk egy új hiba objektumot
badNameError = new Error ("Felhasználó neve nem megfelelő!");
noNameError = new Error ("Felhasználó neve nem lehet üres");
// általános hibakezelés
// ami megjelenik az üzenetben
// De akár azt is megteheted hogy saját magad által elkészített kivételkezelést //csinálsz
function mainExceptionHandler(e) {
alert (e.message);
}
// általános form érvényesítő rész, amit meghívok HTML kódból
function validateForm() {
checkName();
}
// ellenőrzi az értéket
// Hiba esetén a függvényt hívja meg
function checkName() {
try {
if (document.forms[0].username.value == "") {
throw noNameError;
}
if (document.forms[0].username.value != "john") {
throw badNameError;
}
} catch (e) {
// minden más hiba esetén ez a rész fut le
mainExceptionHandler(e);
}
}
</script>
</head>
<body>
<form onSubmit="validateForm()">
Kérem a felhasználó nevét: <input type="text" name="username"> <br>
<input type="submit" name="submit" value="Go">
</form>
</body>
</html>
Minden olyan esetben belép a honlapra, ha nem üres a mező vagy nem John az értéke.
Kivételek kezelése
A hiba részletes lebontása és a hiba kezelése is elvégezhtő JS segítségével, még pedig úgy, hogy a hiba nevében („error name”) szereplő hiba név (típusa) alapján kezeljük le őket.
Nézzük a következő példát:
<script language="JavaScript">
try {
colours[2] = "red";
} catch (e) {
if (e instanceof TypeError) {
alert("Rossz, nem definiált változó!");
}
}
</script>
Kimenete:
Rossz, nem definiált változó!
Természetesen most a TypeError –ra volt kihegyezve a példa, de JS 1.5 specifikációjában 6 elsődleges hibaüzenet van, melyek a következők:
- EvalError - Akkor generálódik, amikor az eval() funkciót helytelenül használjuk;
- RangeError – Akkor generálódik, amikor egy szám meghaladja a korlátját;
- ReferenceError - Akkor generálódik, amikor helytelen hivatkozás történik;
- SyntaxError - Akkor generálódik, amikor szintaktikai hiba történik;
- TypeError - Akkor generálódik, amikor a változó típusa nem létezik;
- URIError - Akkor generálódik, amikor az encodeURI() vagy decodeURI() funkciót helytelenül használjuk;
Előfordulhat az is, hogy többféle hiba típus is előfordulhat. Ekkor használhatjuk az if metódusokat, melyek segítségével mindegyik hibát külön-külön lekezelhetjük:
Kivételkezelés szétbontása és hibák figyelmen kívűl hagyása
A hibaüzenet szétbontható hibatípusra és hibaüzenetre. Nézzük meg hogyan lehet ezt értelmezni egy JavaScript forráskódban:
<script language="JavaScript">
try {
colours[2] = "red";
} catch (e) {
alert("An exception occurred in the script. Error name: " + e.name
+ ". Error message: " + e.message); }
</script>
Ez lesz az eredmény:
An exception occurred in the script. Error name: TypeError. Error message: 'colours' is undefined
A következő példában azt demonstráljuk, hogyan lehet átugrani a hibákat:
<script language="JavaScript">
try {
// Hiba képződés lehetőségének helye
eval("Bármilyen JS forráskód lehet")
} catch (e) {
// Ez a rész átugrásra (ignore) kerül
}
</script>
Ebben az esetben hiba képződik ugyan, de a felhasználó nem szerez róla tudomást, a program lefolyása folytatódik.
Finally
Js engedélyezi hogy egy "finally" részt adjunk a kivételkezeléshez. Ez a rész tartalmazza azt a futtatandó sort, amely kivétel nélkül lefut akár van hiba, akár nincs.
try {
Futó program rész
} catch (error) {
Hiba esetén lefuttatott rész
} finally {
Minden esetben lefutó program rész
}
Nézzünk rá egy példát
<script language="JavaScript">
// Felhasználó beviteli rész
code = prompt("JS kód");
// fut a kód és ha hiba képződik akkor lefut
// after Üdvözlő üzenet megjeleni minden esetben
try {
eval(code);
} catch (e) {
alert("Következő a hiba üzenet: " + e.name + " - "
+ e.message); } finally {
alert ("Kösz hogy kipróbáltad! Tedd meg máskor is!");
}
</script>
Kimeneti üzenet
Kösz hogy kipróbáltad! Tedd meg máskor is!
Onerror esemény
Az onerror esemény akkor keletkezik, ha egy script hiba keletkezik egy lapon belül.
Akkor használható, amikor a hibáról írok egy lekezelő részt (function), ez hiba esetén meghívódik. Az onerror 3 részből áll: a hibaüzenet (msg), hiba lehetséges okainak lapja (url) és a sor ahol a hiba keletkezett (l)
Szintaktikája
onerror=handleErr
function handleErr(msg,url,l) {
//Handle the error here
return true or false
}
A visszatérő érték azt vezérli hogy a böngésző megjeleníti-e a hiba üzenetet. Hamis állítás esetén consolon jelenik meg a hibaüzenet, igaz állítás esetén nem jelenik meg a standard üzenet.
Példa
<html>
<head>
<script type="text/javascript">
onerror=handleErr
var txt=""
function handleErr(msg,url,l) {
txt="There was an error on this page.\n\n"
txt+="Error: " + msg + "\n"
txt+="URL: " + url + "\n"
txt+="Line: " + l + "\n\n"
txt+="Click OK to continue.\n\n"
alert(txt)
return true
}
function message() {
adddlert("Welcome guest!")
}
</script>
</head>
<body>
<input type="button" value="View message" onclick="message()" />
</body>
</html>