Errori JavaScript
Lancia e prova... Cattura... Finalmente
L' tryistruzione definisce un blocco di codice da eseguire (da provare).
L' catchistruzione definisce un blocco di codice per gestire qualsiasi errore.
L' finallyistruzione definisce un blocco di codice da eseguire indipendentemente dal risultato.
L' throwistruzione definisce un errore personalizzato.
Gli errori accadranno!
Quando si esegue codice JavaScript, possono verificarsi diversi errori.
Gli errori possono essere errori di codifica commessi dal programmatore, errori dovuti a input errati e altre cose imprevedibili.
Esempio
In questo esempio abbiamo sbagliato a scrivere "alert" come "adddlert" per produrre deliberatamente un errore:
<p id="demo"></p>
<script>
try {
adddlert("Welcome guest!");
}
catch(err) {
document.getElementById("demo").innerHTML = err.message;
}
</script>
JavaScript rileva adddlert come un errore ed esegue il codice catch per gestirlo.
JavaScript prova e cattura
L' tryistruzione consente di definire un blocco di codice da testare per verificare la presenza di errori durante l'esecuzione.
L' catchistruzione consente di definire un blocco di codice da eseguire, se si verifica un errore nel blocco try.
Le istruzioni JavaScript trye catch
sono disponibili in coppia:
try {
Block of code to try
}
catch(err) {
Block of code to handle errors
}
JavaScript genera errori
Quando si verifica un errore, JavaScript normalmente si interrompe e genera un messaggio di errore.
Il termine tecnico per questo è: JavaScript genererà un'eccezione (genera un errore) .
JavaScript creerà effettivamente un oggetto Error con due proprietà: name e message .
La dichiarazione di lancio
L' throwistruzione consente di creare un errore personalizzato.
Tecnicamente puoi generare un'eccezione (generare un errore) .
L'eccezione può essere JavaScript String, a Number, a Booleano an Object:
throw "Too big"; // throw a text
throw 500; // throw a number
Se si utilizza throwinsieme a trye
catch, è possibile controllare il flusso del programma e generare messaggi di errore personalizzati.
Esempio di convalida dell'input
Questo esempio esamina l'input. Se il valore è errato, viene generata un'eccezione (err).
L'eccezione (err) viene rilevata dall'istruzione catch e viene visualizzato un messaggio di errore personalizzato:
<!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>
Convalida HTML
Il codice sopra è solo un esempio.
I browser moderni utilizzeranno spesso una combinazione di JavaScript e di convalida HTML integrata, utilizzando regole di convalida predefinite definite negli attributi HTML:
<input id="demo" type="number" min="5" max="10" step="1">
Puoi leggere di più sulla convalida dei moduli in un capitolo successivo di questo tutorial.
La dichiarazione finale
L' finallyistruzione ti consente di eseguire codice, dopo try and catch, indipendentemente dal risultato:
Sintassi
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
}Esempio
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 = "";
}
}
L'oggetto di errore
JavaScript ha un oggetto di errore integrato che fornisce informazioni sull'errore quando si verifica un errore.
L'oggetto errore fornisce due proprietà utili: nome e messaggio.
Proprietà dell'oggetto di errore
| Proprietà | Descrizione |
|---|---|
| nome | Imposta o restituisce un nome di errore |
| Messaggio | Imposta o restituisce un messaggio di errore (una stringa) |
Valori del nome di errore
Sei valori diversi possono essere restituiti dalla proprietà del nome dell'errore:
| Nome errore | Descrizione |
|---|---|
| Errore di valutazione | Si è verificato un errore nella funzione eval() |
| Errore di intervallo | Si è verificato un numero "fuori intervallo". |
| Errore di riferimento | Si è verificato un riferimento illegale |
| Errore di sintassi | Si è verificato un errore di sintassi |
| Digitare Errore | Si è verificato un errore di tipo |
| Errore URI | Si è verificato un errore in encodeURI() |
I sei diversi valori sono descritti di seguito.
Errore di valutazione
An EvalErrorindica un errore nella funzione eval().
Le versioni più recenti di JavaScript non generano EvalError. Utilizzare invece SyntaxError.
Errore di intervallo
Viene RangeErrorgenerato A se si utilizza un numero che non rientra nell'intervallo di valori consentiti.
Ad esempio: non è possibile impostare il numero di cifre significative di un numero su 500.
Esempio
let num = 1;
try {
num.toPrecision(500); // A number cannot have 500
significant digits
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Errore di riferimento
Viene ReferenceErrorlanciato A se si utilizza (riferimento) una variabile che non è stata dichiarata:
Esempio
let x = 5;
try {
x = y + 1; // y cannot be used (referenced)
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Errore di sintassi
Viene SyntaxErrorgenerato A se si tenta di valutare il codice con un errore di sintassi.
Esempio
try {
eval("alert('Hello)"); //
Missing ' will produce an error
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Digita Errore
Viene TypeErrorgenerato A se si utilizza un valore che non rientra nell'intervallo dei tipi previsti:
Esempio
let num = 1;
try {
num.toUpperCase(); // You cannot convert a number
to upper case
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Errore URI (Uniform Resource Identifier).
Viene URIErrorgenerato A se si utilizzano caratteri illegali in una funzione URI:
Esempio
try {
decodeURI("%%%"); // You cannot URI decode
percent signs
}
catch(err) {
document.getElementById("demo").innerHTML = err.name;
}
Proprietà dell'oggetto di errore non standard
Mozilla e Microsoft definiscono alcune proprietà degli oggetti di errore non standard:
fileName (Mozilla)
lineNumber (Mozilla)
columnNumber (Mozilla)
stack (Mozilla)
descrizione (Microsoft)
numero (Microsoft)
Non utilizzare queste proprietà nei siti Web pubblici. Non funzioneranno in tutti i browser.
Riferimento errore completo
Per un riferimento completo dell'oggetto Error, vai a Complete JavaScript Error Reference .