Σφάλματα JavaScript - Θrown και Try to Catch

try Η πρόταση επιτρέπει τον έλεγχο σφαλμάτων στον κώδικα.

catch Η πρόταση επιτρέπει την επεξεργασία σφαλμάτων.

throw Η πρόταση επιτρέπει τη δημιουργία προσαρμοσμένων σφαλμάτων.

finally Επιτρέπει την εκτέλεση κώδικα, μετά το try και το catch, ανεξάρτητα από το αποτέλεσμα.

Τα σφάλματα θα συμβούν πάντα!

Όταν εκτελείτε κώδικα JavaScript, μπορεί να συμβούν διάφορα σφάλματα.

Τα σφάλματα μπορεί να προέλθουν από σφάλματα κώδικα του προγραμματιστή, σφάλματα από λάθος εισαγωγής ή από άλλες απρόβλεπτες προβλήματα.

παράδειγμα

Σε αυτό το παράδειγμα, χρησιμοποιούμε adddlert Γράψτε κώδικα προειδοποίησης για να δημιουργήσετε σκόπιμα ένα σφάλμα:

<p id="demo"></p>
<script>
try {
    adddlert("Καλώς ήρθατε να επισκεφτείτε!");
}
catch(err) {
    document.getElementById("demo").innerHTML = err.message;
}
</script>

Προσπαθήστε το προσωπικά

Το JavaScript θα καταγράψει το adddlert ως σφάλμα και θα εκτελέσει κώδικα για την επεξεργασία του σφάλματος.

Το JavaScript try και catch

try Η πρόταση επιτρέπει τη διάκριση ενός κώδικα για την αναγνώριση σφαλμάτων κατά την εκτέλεση.

catch Η πρόταση επιτρέπει τη διάκριση ενός κώδικα που θα εκτελεστεί, αν συμβεί σφάλμα στον κώδικα try.

Συνταγές JavaScript try και catch Παράλληλα:

try {
     Κώδικας για δοκιμή
}
 catch(err) {
     Κώδικας για την επεξεργασία σφαλμάτων
}

Το JavaScript προκαλεί σφάλματα

Όταν συμβεί σφάλμα, το JavaScript συνήθως σταματά και δημιουργεί μήνυμα σφάλματος.

Η τεχνική ορολογία περιγράφεται ως:Το JavaScript θα προκαλέσει εξαίρεση (προκαλέσει σφάλμα).

Το JavaScript δημιουργεί μια εξαίρεση με δύο ιδιότητες: Αντικείμενο Error:name και message.

πρόταση throw

throw Η πρόταση επιτρέπει τη δημιουργία προσαρμοσμένων σφαλμάτων.

Τεχνολογικά μπορείτε ναΕξάγει εξαίρεση (προκαλεί σφάλμα).

Η εξαίρεση μπορεί να είναι αλφαριθμητική, αριθμητική, βολική ή αντικειμενοποίηση του JavaScript:

throw "Too big";    // Εξάγει κείμενο
throw 500;          // Εξάγει αριθμό

αν throw με try και catch Παραλληλώς, μπορείτε να ελέγξετε τον ροή του προγράμματος και να δημιουργήσετε προσαρμοσμένα μηνύματα σφαλμάτων.

Παράδειγμα επαλήθευσης εισαγωγής

Αυτό το παράδειγμα θα ελέγξει την εισαγωγή. Αν η τιμή είναι λάθος, θα προκαλέσει εξαίρεση (err).

Η εξαίρεση (err) απορροφάται από την πρόταση catch και εμφανίζει ένα προσαρμοσμένο μήνυμα σφάλματος:

<!DOCTYPE html>
<html>
<body>
<p>Παρακαλώ εισάγετε αριθμό μεταξύ 5 και 10:</p>
<input id="demo" type="text">
<button type="button" onclick="myFunction()">Δοκιμή Εισαγωγής</button>
<p id="message"></p>
<script>
function myFunction() {
    var message, x;
    message = document.getElementById("message");
    message.innerHTML = "";
    x = document.getElementById("demo").value;
    try { 
        if(x == "") throw "Κενό";
         if(isNaN(x)) throw "Δεν είναι αριθμός";
         x = Number(x);
        if(x < 5) throw "Πολύ μικρό";
        if(x > 10) throw "Πολύ μεγάλο";
    }
    catch(err) {
        message.innerHTML = "Εισαγωγή είναι " + err;
    }
}
</script>
</body>
</html>

Προσπαθήστε το προσωπικά

Επαλήθευση HTML

Ο παραπάνω κώδικας είναι απλώς ένα παράδειγμα.

Οι σύγχρονες περιηγητές συνήθως συνδυάζουν το JavaScript με ενσωματωμένη επαλήθευση HTML, χρησιμοποιώντας προκαθορισμένα σενάρια επαλήθευσης που ορίζονται στις ιδιότητες HTML:

<input id="demo" type="number" min="5" max="10" step="1">

Θα μάθετε περισσότερα για την επαλήθευση φόρμας σε μεταγενέστερη ενότητα αυτού του οδηγού.

finally πρόταση

finally Η πρόταση επιτρέπει την εκτέλεση κώδικα μετά από try και catch, ανεξάρτητα από το αποτέλεσμα:

try {
     // Κώδικας για δοκιμές;
}
 catch(err) {
     // Κώδικας για την αντιμετώπιση σφαλμάτων;
} 
finally {
     // Ο κώδικας που εκτελείται ανεξάρτητα από το αποτέλεσμα;
}

παράδειγμα

function myFunction() {
    var message, x;
    message = document.getElementById("message");
    message.innerHTML = "";
    x = document.getElementById("demo").value;
    try { 
        if(x == "") throw "Είναι κενό";
        if(isNaN(x)) throw "Δεν είναι αριθμός";
         x = Number(x);
        if(x >  10) throw "Πολύ μεγάλο";
        if(x <  5) throw "Πολύ μικρό";
    }
    catch(err) {
        message.innerHTML = "Σφάλμα: " + err + ".";
    }
    finally {
        document.getElementById("demo").value = "";
    }
}

Προσπαθήστε το προσωπικά

Αντικείμενο Error

Το JavaScript έχει ενσωματωμένο αντικείμενο error που παρέχει πληροφορίες σφάλματος όταν συμβαίνει σφάλμα.

το αντικείμενο error παρέχει δύο χρήσιμες ιδιότητες:name και message.

Ιδιότητες του αντικειμένου Error

Ιδιότητα Περιγραφή
name Ρύθμιση ή επιστροφή του ονόματος σφάλματος
message Ρύθμιση ή επιστροφή του μηνύματος σφάλματος (μια αλφαριθμητική ακολουθία)

Τιμές Ονόματος Σφάλματος

Η ιδιότητα name του error μπορεί να επιστρέψει έξι διαφορετικές τιμές:

Όνομα σφάλματος Περιγραφή
EvalError Σφάλμα που έχει συμβεί στην εντολή eval()
RangeError Σφάλμα που έχει συμβεί με αριθμό εκτός φάσματος
ReferenceError Σφάλμα παράβασης αναφοράς που έχει συμβεί
SyntaxError Σφάλμα γραμματικής που έχει συμβεί
TypeError Σφάλμα τύπου που έχει συμβεί
URIError Σφάλμα που έχει συμβεί στο encodeURI()

Περιγράψτε τις έξι διαφορετικές τιμές αυτές.

Σφάλμα Eval

EvalError σήμα σφάλματος στην εντολή eval()

Η νέα έκδοση του JavaScript δεν θα προκαλέσει κανένα EvalErrorΠαρακαλώ χρησιμοποιήστε SyntaxError αντικαταστήστε με

σφάλμα περιοχής

RangeError θα προκαλέσει σφάλμα όταν χρησιμοποιήσετε αριθμούς εκτός του νόμιμου ορίου τιμών.

π.χ. δεν μπορείτε να ορίσετε το αριθμητικό αποτέλεσμα σε 500 σημαντικές θέσεις.

παράδειγμα

var num = 1;
try {
    num.toPrecision(500);   // Ο αριθμός δεν μπορεί να έχει 500 σημαντικές αριθμητικές μονάδες
 }
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
}

Προσπαθήστε το προσωπικά

σφάλμα αναφοράς

Εάν χρησιμοποιήσετε (αναφέρετε) μεταβλητή που δεν έχει δηλωθεί, τότε ReferenceError θα προκαλέσει:

παράδειγμα

var x;
try {
    x = y + 1;   // Η y δεν μπορεί να αναφερθεί (χρησιμοποιηθεί)
 }
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
}

Προσπαθήστε το προσωπικά

σφάλμα γραμματικής

Εάν υπολογίσετε κώδικα με σφάλματα γραμματικής, θα SyntaxError αποτύχει:

παράδειγμα

try {
    eval("alert('Hello')");   // Η έλλειψη ' θα προκαλέσει σφάλμα
}
catch(err) {
     document.getElementById("demo").innerHTML = err.name;
}

Προσπαθήστε το προσωπικά

σφάλμα τύπου

Εάν η τιμή που χρησιμοποιείτε δεν βρίσκεται εντός του αναμενόμενου ορίου τιμών, τότε TypeError αποτύχει:

παράδειγμα

var num = 1;
try {
    num.toUpperCase();   // Δεν μπορείτε να μετατρέψετε τον αριθμό σε κεφαλαία
 }
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
}

Προσπαθήστε το προσωπικά

URI σφάλμα

Αν χρησιμοποιήσετε μη νόμιμα χαρακτήρες στις λειτουργίες URI, τότε URIError αποτύχει:

παράδειγμα

try {
    decodeURI("%%%");   // Δεν μπορείτε να κωδικοποιήσετε αυτές τις τοποθεσίες URI
 }
catch(err) {
    document.getElementById("demo").innerHTML = err.name;
}

Προσπαθήστε το προσωπικά

Μη standardιζόμενες ιδιότητες του error αντικειμένου

Το Mozilla και το Microsoft ορίζουν μη стандартизованные προσαρμοσμένες ιδιότητες του error αντικειμένου:

  • fileName (Mozilla)
  • lineNumber (Mozilla)
  • columnNumber (Mozilla)
  • stack (Mozilla)
  • description (Microsoft)
  • number (Microsoft)

Μη χρησιμοποιήστε αυτές τις ιδιότητες σε δημόσιους ιστότοπους. Δεν λειτουργούν σε όλους τους περιηγητές.