Chyby JavaScriptu
Hoď a zkus... Chyť... Konečně
Příkaz try
definuje blok kódu, který se má spustit (vyzkoušet).
Příkaz catch
definuje blok kódu pro zpracování jakékoli chyby.
Příkaz finally
definuje blok kódu, který se má spustit bez ohledu na výsledek.
Příkaz throw
definuje vlastní chybu.
Chyby se budou dít!
Při provádění kódu JavaScript se mohou vyskytnout různé chyby.
Chyby mohou být chyby v kódování způsobené programátorem, chyby způsobené nesprávným zadáním a další nepředvídatelné věci.
Příklad
V tomto příkladu jsme chybně zadali „alert“ jako „adddlert“, abychom záměrně vytvořili chybu:
<p id="demo"></p>
<script>
try {
adddlert("Welcome guest!");
}
catch(err) {
document.getElementById("demo").innerHTML = err.message;
}
</script>
JavaScript zachytí adddlert jako chybu a spustí kód catch, aby to zpracoval.
JavaScript zkuste a chytněte
Příkaz try
vám umožňuje definovat blok kódu, který má být testován na chyby během jeho provádění.
Příkaz catch
vám umožňuje definovat blok kódu, který se má provést, pokud v bloku try dojde k chybě.
Příkazy JavaScriptu try
a catch
jsou ve dvojicích:
try {
Block of code to try
}
catch(err) {
Block of code to handle errors
}
JavaScript vyvolává chyby
Když dojde k chybě, JavaScript se normálně zastaví a vygeneruje chybovou zprávu.
Technický termín pro to je: JavaScript vyvolá výjimku (vyvolá chybu) .
JavaScript ve skutečnosti vytvoří objekt Error se dvěma vlastnostmi: name a message .
Prohlášení o hodu
Příkaz throw
umožňuje vytvořit vlastní chybu.
Technicky můžete vyvolat výjimku (vyvolat chybu) .
Výjimkou může být JavaScript String
, a Number
, a Boolean
nebo Object
:
throw "Too big"; // throw a text
throw 500; // throw a number
Pokud použijete throw
společně s try
a
catch
, můžete řídit tok programu a generovat vlastní chybové zprávy.
Příklad ověření vstupu
Tento příklad zkoumá vstup. Pokud je hodnota nesprávná, vyvolá se výjimka (err).
Výjimka (err) je zachycena příkazem catch a zobrazí se vlastní chybová zpráva:
<!DOCTYPE html>
<html>
<body>
<p>Please input a number between
5 and 10:</p>
<input id="demo" type="text">
<button type="button"
onclick="myFunction()">Test Input</button>
<p id="p01"></p>
<script>
function myFunction() {
const message =
document.getElementById("p01");
message.innerHTML = "";
let x =
document.getElementById("demo").value;
try {
if(x == "") throw "empty";
if(isNaN(x)) throw "not a number";
x = Number(x);
if(x < 5) throw
"too low";
if(x > 10) throw "too
high";
}
catch(err) {
message.innerHTML =
"Input is " + err;
}
}
</script>
</body>
</html>
Ověření HTML
Výše uvedený kód je pouze příkladem.
Moderní prohlížeče často používají kombinaci JavaScriptu a vestavěné validace HTML pomocí předem definovaných ověřovacích pravidel definovaných v atributech HTML:
<input id="demo" type="number" min="5" max="10" step="1">
Více o ověřování formulářů si můžete přečíst v pozdější kapitole tohoto kurzu.
Závěrečné prohlášení
Příkaz finally
vám umožňuje spustit kód po pokusu a zachycení, bez ohledu na výsledek:
Syntax
try {
Block of code to try
}
catch(err) {
Block of code to handle errors
}
finally {
Block of code to be executed regardless of the try / catch result
}
Příklad
function myFunction() {
const message =
document.getElementById("p01");
message.innerHTML = "";
let x =
document.getElementById("demo").value;
try {
if(x == "") throw "is empty";
if(isNaN(x))
throw "is not a number";
x = Number(x);
if(x >
10) throw "is too high";
if(x <
5) throw "is too low";
}
catch(err)
{
message.innerHTML = "Error: " +
err + ".";
}
finally {
document.getElementById("demo").value = "";
}
}
Objekt chyby
JavaScript má vestavěný chybový objekt, který poskytuje informace o chybě, když dojde k chybě.
Chybový objekt poskytuje dvě užitečné vlastnosti: název a zprávu.
Chyba Vlastnosti objektu
Vlastnictví | Popis |
---|---|
název | Nastaví nebo vrátí název chyby |
zpráva | Nastaví nebo vrátí chybovou zprávu (řetězec) |
Hodnoty názvu chyby
Vlastnost error name může vrátit šest různých hodnot:
Název chyby | Popis |
---|---|
EvalError | Ve funkci eval() došlo k chybě |
RangeError | Došlo k číslu „mimo rozsah“. |
ReferenceError | Došlo k nezákonnému odkazu |
Chyba syntaxe | Došlo k chybě syntaxe |
TypeError | Došlo k chybě typu |
URIError | V encodeURI() došlo k chybě |
Šest různých hodnot je popsáno níže.
Chyba Eval
An EvalError
označuje chybu ve funkci eval().
Novější verze JavaScriptu nezpůsobují EvalError. Místo toho použijte SyntaxError.
Chyba rozsahu
A RangeError
je vyvoláno, pokud použijete číslo, které je mimo rozsah zákonných hodnot.
Například: Nemůžete nastavit počet platných číslic čísla na 500.
Příklad
let num = 1;
try {
num.toPrecision(500); // A number cannot have 500
significant digits
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Referenční chyba
A ReferenceError
je vyvoláno, pokud použijete (odkaz) na proměnnou, která nebyla deklarována:
Příklad
let x = 5;
try {
x = y + 1; // y cannot be used (referenced)
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Chyba syntaxe
A SyntaxError
je vyvoláno, pokud se pokusíte vyhodnotit kód s chybou syntaxe.
Příklad
try {
eval("alert('Hello)"); //
Missing ' will produce an error
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Chyba typu
A TypeError
je vyvoláno, pokud použijete hodnotu, která je mimo rozsah očekávaných typů:
Příklad
let num = 1;
try {
num.toUpperCase(); // You cannot convert a number
to upper case
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Chyba URI (Uniform Resource Identifier).
A URIError
je vyvoláno, pokud ve funkci URI použijete nepovolené znaky:
Příklad
try {
decodeURI("%%%"); // You cannot URI decode
percent signs
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Vlastnosti nestandardního chybového objektu
Mozilla a Microsoft definují některé nestandardní vlastnosti chybového objektu:
fileName (Mozilla)
lineNumber (Mozilla)
columnNumber (Mozilla)
stack (Mozilla)
popis (Microsoft)
číslo (Microsoft)
Nepoužívejte tyto vlastnosti na veřejných webových stránkách. Nebudou fungovat ve všech prohlížečích.
Kompletní odkaz na chybu
Úplnou referenci o objektu Error naleznete v naší úplné referenci o chybách JavaScriptu .