Błędy JavaScript
Rzuć i spróbuj... złap... w końcu
Instrukcja trydefiniuje blok kodu do uruchomienia (do wypróbowania).
Instrukcja catchdefiniuje blok kodu do obsługi dowolnego błędu.
Instrukcja finallydefiniuje blok kodu do uruchomienia niezależnie od wyniku.
Instrukcja throwdefiniuje błąd niestandardowy.
Pojawią się błędy!
Podczas wykonywania kodu JavaScript mogą wystąpić różne błędy.
Błędy mogą być błędami w kodowaniu popełnionymi przez programistę, błędami spowodowanymi niewłaściwymi danymi wejściowymi i innymi nieprzewidywalnymi rzeczami.
Przykład
W tym przykładzie błędnie napisaliśmy „alert” jako „adddlert”, aby celowo spowodować błąd:
<p id="demo"></p>
<script>
try {
adddlert("Welcome guest!");
}
catch(err) {
document.getElementById("demo").innerHTML = err.message;
}
</script>
JavaScript przechwytuje adddlerta jako błąd i wykonuje kod catch, aby go obsłużyć.
JavaScript spróbuj i złap
Instrukcja tryumożliwia zdefiniowanie bloku kodu, który ma być testowany pod kątem błędów podczas jego wykonywania.
Instrukcja catchumożliwia zdefiniowanie bloku kodu, który ma zostać wykonany, jeśli wystąpi błąd w bloku try.
Instrukcje JavaScript tryi catch
występują w parach:
try {
Block of code to try
}
catch(err) {
Block of code to handle errors
}
JavaScript zgłasza błędy
Gdy wystąpi błąd, JavaScript zwykle zatrzymuje się i generuje komunikat o błędzie.
Terminem technicznym na to jest: JavaScript zgłosi wyjątek (zgłosi błąd) .
JavaScript w rzeczywistości utworzy obiekt Error z dwiema właściwościami: name i message .
Oświadczenie rzutu
Oświadczenie throwpozwala na stworzenie niestandardowego błędu.
Technicznie możesz zgłosić wyjątek (zgłosić błąd) .
Wyjątkiem może być JavaScript String, a Number, a Booleanlub an Object:
throw "Too big"; // throw a text
throw 500; // throw a number
Jeśli używasz throwrazem z tryi
catch, możesz kontrolować przepływ programu i generować niestandardowe komunikaty o błędach.
Przykład walidacji danych wejściowych
Ten przykład analizuje dane wejściowe. Jeśli wartość jest nieprawidłowa, zgłaszany jest wyjątek (err).
Wyjątek (err) jest przechwytywany przez instrukcję catch i wyświetlany jest niestandardowy komunikat o błędzie:
<!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>
Walidacja HTML
Powyższy kod to tylko przykład.
Nowoczesne przeglądarki często używają kombinacji JavaScript i wbudowanej walidacji HTML, używając predefiniowanych reguł walidacji zdefiniowanych w atrybutach HTML:
<input id="demo" type="number" min="5" max="10" step="1">
Możesz przeczytać więcej o walidacji formularzy w kolejnym rozdziale tego samouczka.
Ostateczne oświadczenie
Instrukcja finallyumożliwia wykonanie kodu po try and catch, niezależnie od wyniku:
Składnia
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
}Przykład
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 = "";
}
}
Obiekt błędu
JavaScript ma wbudowany obiekt błędu, który dostarcza informacje o błędzie, gdy wystąpi błąd.
Obiekt error udostępnia dwie przydatne właściwości: name i message.
Błędne właściwości obiektu
| Nieruchomość | Opis |
|---|---|
| Nazwa | Ustawia lub zwraca nazwę błędu |
| wiadomość | Ustawia lub zwraca komunikat o błędzie (ciąg) |
Wartości nazw błędów
Właściwość nazwy błędu może zwrócić sześć różnych wartości:
| Nazwa błędu | Opis |
|---|---|
| Błąd oceny | Wystąpił błąd w funkcji eval() |
| Błąd zakresu | Wystąpił numer „poza zakresem” |
| Błąd odniesienia | Wystąpiło nielegalne odniesienie |
| Błąd składni | Wystąpił błąd składni |
| Wpisz błąd | Wystąpił błąd typu |
| Błąd URI | Wystąpił błąd w encodeURI() |
Sześć różnych wartości opisano poniżej.
Błąd oceny
An EvalErrorwskazuje błąd w funkcji eval().
Nowsze wersje JavaScript nie wyrzucają EvalError. Zamiast tego użyj SyntaxError.
Błąd zakresu
A RangeErrorjest wyrzucane, jeśli użyjesz liczby, która jest poza dozwolonym zakresem wartości.
Na przykład: Nie można ustawić liczby cyfr znaczących liczby na 500.
Przykład
let num = 1;
try {
num.toPrecision(500); // A number cannot have 500
significant digits
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Błąd odniesienia
A ReferenceErrorzostanie wyrzucone, jeśli użyjesz (odwołanie) zmiennej, która nie została zadeklarowana:
Przykład
let x = 5;
try {
x = y + 1; // y cannot be used (referenced)
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Błąd składni
A SyntaxErrorjest generowany, jeśli spróbujesz ocenić kod z błędem składni.
Przykład
try {
eval("alert('Hello)"); //
Missing ' will produce an error
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Błąd typu
A TypeErrorjest generowany, jeśli użyjesz wartości spoza zakresu oczekiwanych typów:
Przykład
let num = 1;
try {
num.toUpperCase(); // You cannot convert a number
to upper case
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Błąd URI (Uniform Resource Identifier)
A URIErrorzostanie wyrzucone, jeśli użyjesz niedozwolonych znaków w funkcji URI:
Przykład
try {
decodeURI("%%%"); // You cannot URI decode
percent signs
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Niestandardowe właściwości obiektu błędu
Mozilla i Microsoft definiują niektóre niestandardowe właściwości obiektu błędu:
fileName (Mozilla)
lineNumber (Mozilla)
columnNumber (Mozilla
) opis stosu (Mozilla)
(Microsoft)
numer (Microsoft)
Nie używaj tych właściwości w publicznych witrynach internetowych. Nie będą działać we wszystkich przeglądarkach.
Pełne odniesienie do błędów
Aby uzyskać pełne odniesienie do obiektu Error, przejdź do naszej Kompletnej dokumentacji błędów JavaScript .