Programmierfehler sind unvermeidlich. Früher oder später wird Ihre Anwendung ein unerwartetes Verhalten erfahren. Wie jede andere Programmiersprache löst JavaScript Fehler aus, wenn in Ihrem Code etwas schief geht.

Fehler unterbrechen den normalen Ablauf einer Anwendung. Aber sie tragen auch dazu bei, Ihre Anwendung vor unvorhersehbarem Verhalten zu schützen. Zu wissen, wie man mit Fehlern richtig umgeht, ist entscheidend.

Warum ist die Fehlerbehandlung wichtig?

Die Fehlerbehandlung trägt zu einer verbesserten Benutzererfahrung bei. Sie können die standardmäßigen und manchmal ausführlichen Fehler von JavaScript durch eigene, für Menschen lesbare Fehlermeldungen ersetzen. Sie können die Ursachen einiger Fehler elegant behandeln und Ihr Programm am Laufen halten, anstatt es zu beenden.

Auch die Fehlerbehandlung ist während der Entwicklung hilfreich. Sie können einen Laufzeitfehler abfangen und etwas Nützliches damit machen, z in der Browserkonsole protokollieren. Dies ist eleganter als der Fehler, der einen Absturz verursacht und nicht weiß, wo oder warum der Fehler aufgetreten ist.

Struktur von JavaScript eingebauten Fehlern

JavaScript-Fehler sind Objekte mit drei Eigenschaften:

  • Name: Dies ist der Name des Fehlers. Beispielsweise wird ein fehlender Variablenname einen Fehler namens SyntaxError auslösen.
  • Botschaft: Dies ist der Hauptteil der Nachricht und erklärt den Fehler textlich.
  • weil: Sie können diese Eigenschaft mit benutzerdefinierten Fehlern verwenden, um den Aufrufstapel zu verfolgen.

Häufige Fehlertypen in JavaScript

Hier sind einige häufige Fehler in JavaScript.

Syntax-Fehler

Syntaxfehler können auftreten, wenn JavaScript versucht, Ihren Code zu interpretieren. Es wird ein Fehler ausgelöst, wenn Ihr Code nicht der korrekten Syntax entspricht. Einige häufige Fehler, die Syntaxfehler auslösen können, sind:

  • Variablennamen fehlen.
  • Fehlendes „}“ nach einer Funktion.
  • Fehlendes „)“ nach einer Bedingung.

Referenzfehler

Referenzfehler treten auf, wenn ein Programm dies versucht auf eine Variable verweisen die nicht verfügbar oder außerhalb des Geltungsbereichs ist.

TypeError

JavaScript kann einen Typfehler auslösen, wenn es eine Operation nicht ausführen kann, weil der erwartete Typ sich von dem unterscheidet, den es empfängt.

URIFehler

Dieser Fehler tritt auf, wenn Sie eine globale URI-Behandlungsfunktion – wie decodeURIComponent() – falsch verwenden. Als Ergebnis schlägt die Codierung oder Decodierung fehl.

AggregateError

Dieser Fehler wird verwendet, um mehrere Fehler darzustellen, die in einem zusammengefasst sind. Verwenden Sie es, wenn Sie viele Fehler gleichzeitig werfen möchten. Beispielsweise kann Promise.any() einen AggregateError() auslösen, wenn alle ihm übergebenen Promises abgelehnt werden.

Interner Fehler

Ein InternalError wird ausgelöst, wenn innerhalb der JavaScript-Engine ein Fehler auftritt.

RangeError

Einige Funktionen schreiben den Wertebereich vor, den Sie als Argumente übergeben können. Dieser Fehler tritt auf, wenn Sie versuchen, einen Wert zu übergeben, der nicht in diesem Bereich enthalten ist.

Fehlerbehandlung beim Try... Fangblock

JavaScript bietet eine integrierte Ausnahmebehandlungsfunktionalität mit der versuchen... fangen... endlich Block. Es erlaubt Ihnen auch, Ihre eigenen Fehler mit dem zu melden Wurf Operator.

Sie können einen try…catch-Block verwenden, um Fehler zu behandeln, die während der Laufzeit auftreten. Sie schreiben gültigen Code, von dem Sie erwarten, dass er korrekt im try-Block ausgeführt wird. Im catch-Block können Sie Fehlerbehandlungscode schreiben.

Versuchen {
// Gültiger Javascript-Code
} Fang (Error) {
// Fehler behandeln
} endlich {
// Wird auch ausgeführt, wenn ein Fehler auftritt
}

Der catch-Block wird ignoriert, wenn der Code im try-Block keine Fehler auslöst. Wenn es einen Fehler auslöst, springt die Ausführung zum catch-Block. Code im finally-Block wird unabhängig davon ausgeführt, ob ein Fehler auftritt oder nicht. Dieser Block ist nicht obligatorisch, lassen Sie ihn also weg, wenn Sie ihn nicht benötigen.

Der Code, den Sie in den try-Block einfügen, muss gültig sein. Ist dies nicht der Fall, wirft JavaScript einen Parsing-Fehler aus.

Schauen wir uns ein praktisches Beispiel an:

Versuchen {
Konsole.log (Text)
} Fang (Error) {
Konsole.Protokoll(Error.Botschaft)
} endlich {
 Konsole.log ("Wird trotzdem hingerichtet")
}

Dieses Programm versucht, den Wert der Textvariablen zu protokollieren. Da diese Variable nicht definiert ist, gibt das Programm einen Fehler aus. Dieser Fehler wird auf der Konsole im catch-Block ausgegeben. Der finally-Block wird dann ausgeführt und gibt eine eigene Nachricht aus.

Referenzfehler: Text ist nicht definiert
Wird trotzdem hingerichtet

In Situationen, in denen Sie Ihren eigenen Fehler melden müssen, verwenden Sie die Wurf Operator.

Betrachten Sie dieses Beispiel, das einen Fehler auslöst, wenn die Daten falsch sind:

konst Daten = getData()
Versuchen {
 wenn (! Daten) {
 Wurf "Keine Daten"
 }
Konsole.Logdaten)
// fortsetzen
} Fang(Error) {
Konsole.log (Fehler) // "Keine Daten"
}

In diesem Beispiel ruft das Programm die Funktion getData() auf und weist ihr Ergebnis der Variablen data zu. Im try-Block gibt der Block einen benutzerdefinierten Fehler aus, wenn die Daten leer sind. Der catch-Block fängt diesen Fehler ab und protokolliert ihn in der Konsole.

Wurffehler sind während der Entwicklung sehr vorteilhaft. Anhand der benutzerdefinierten Fehlermeldung können Sie nachvollziehen, warum Ihre Anwendung nicht wie erwartet funktioniert.

Wie dieses Beispiel zeigt, können Sie eine Zeichenfolge für das Fehlerobjekt verwenden. Sie können tatsächlich jeden JavaScript-Ausdruck als Fehler ausgeben. Verwenden Sie jedoch aus Gründen der Konsistenz mit integrierten Fehlern ein JavaScript-Objekt, das einen Namen und eine Nachricht enthält.

Wurf {
 Name: "Fehlername", 
 Botschaft: "Fehlermeldung"
}

Sie können beim Auslösen von Fehlern auch die integrierten Konstruktoren von JavaScript verwenden. Zu diesen Konstruktoren gehören unter anderem Error, SyntaxError und ReferenceError.

Um einen Fehler mit dem Error-Konstruktor auszulösen, verwenden Sie diesen Code:

WurfNeuFehler("Keine Daten")

Sie können jetzt auf den Namen und die Nachricht verweisen.

Konsole.log (Fehler.Name) // Fehler
Konsole.log (Fehlermeldung) // Keine Daten

Erweitern des JavaScript-Fehlerobjekts

Eine benutzerdefinierte Fehlerklasse ist praktisch, wenn Fehler behandelt werden, die nicht den bereits von JavaScript bereitgestellten Objekten entsprechen. Beispielsweise möchten Sie möglicherweise einen Datenvalidierungsfehler als einen bestimmten Typ namens ValidationError isolieren.

Sie können eine verwenden JavaScript ES2015-Klasse um eine benutzerdefinierte Fehlerklasse zu erstellen.

KlasseValidierungsfehlererweitertFehler{
Konstrukteur(Botschaft) {
super(Botschaft);
 this.name = "Validierungsfehler";
 }
}

Geben Sie einen Fehler aus, indem Sie die ValidationError-Klasse wie folgt verwenden:

WurfNeu ValidationError("Ihre Fehlermeldung")

Der ausgelöste Fehler ist ein Objekt mit dem Namen und den Nachrichtenwerten.

{
 Name: "Validierungsfehler",
 Botschaft: "Ihre Fehlermeldung"
}

Fehler sind da, um zu helfen

Die Fehlerbehandlung ist ein grundlegender Bestandteil der Programmierung, unabhängig davon, welche Sprache Sie verwenden. JavaScript unterstützt hervorragend das Auslösen und Abfangen von Fehlern im Stil von Ausnahmen. Es hat auch mehrere eingebaute Fehlertypen, die Sie behandeln und für Ihre eigenen Fälle verwenden können.

Einige Fehler wie Syntaxfehler können unentdeckt bleiben, wenn Sie JavaScript im „sloppy mode“ schreiben. Durch die Verwendung des strikten Modus kann JavaScript Fehler abfangen, die es andernfalls ignoriert hätte.