Variable ist da, aber scheinbar nicht? Wir klären die Überprüfungen in JavaScript
\n\nHaben Sie jemals ein Skript geschrieben, es ausgeführt, und plötzlich – bumm! – färbt sich die Browserkonsole rot mit dem Schrei Uncaught ReferenceError: myVar is not defined? Kommt Ihnen bekannt vor. Oder umgekehrt: Die Variable wurde deklariert, aber Sie sind sich nicht sicher, ob ihr ein Wert zugewiesen wurde. In JavaScript werden diese beiden Konzepte („existiert“ und „initialisiert“) selbst von erfahrenen Entwicklern oft verwechselt.
In diesem Leitfaden klären wir ein für alle Mal, wie man überprüft, ob eine Variable in JavaScript existiert, was der Unterschied zwischen „definiert“ und „initialisiert“ ist und wie man 90% der Fehler im Zusammenhang mit undefined und ReferenceError vermeidet. Los geht's!
Kurz und knapp: Was bedeutet „Variable existiert“?
\n\nIn JavaScript hat eine Variable drei Zustände:
\n\n- \n
- Nicht deklariert (undeclared) – Die Variable existiert überhaupt nicht im Speicher. Der Versuch, darauf zuzugreifen, führt zu einem
ReferenceError. \n - Deklariert, aber nicht initialisiert (declared, but undefined) – Wir haben
let x;odervar y;geschrieben, aber keinen Wert zugewiesen. Die Variable existiert, ihr Typ istundefined. \n - Deklariert und initialisiert (declared and initialized) – Die Variable hat einen konkreten Wert (Zahl, Zeichenkette, Objekt usw.). \n
Die meisten Fragen auf Stack Overflow (und es gibt Tausende davon) laufen auf eine hinaus: „Wie erkenne ich, dass eine Variable beim Zugriff keinen Fehler auslöst?“ Die Antwort – verwenden Sie typeof. Aber es gibt Nuancen. Schauen wir uns das genauer an.
Methode Nr. 1. Der typeof-Operator – Ihr bester Freund
\n\nDie zuverlässigste und sicherste Methode, um zu überprüfen, ob eine Variable in JavaScript definiert ist, ist der Operator typeof. Sein größter Vorteil: Er löst niemals einen Fehler aus, selbst wenn die Variable nicht deklariert ist.
Beispiel für eine nicht deklarierte Variable
\n\n// Variable myVar ist nicht deklariert\nif (typeof myVar !== 'undefined') {\n console.log('Variable existiert!');\n} else {\n console.log('Variable existiert NICHT oder ihr Wert ist undefined');\n}\n// Ausgabe: "Variable existiert NICHT oder ihr Wert ist undefined"\n\nBeachten Sie: typeof gibt den String 'undefined' sowohl für eine nicht deklarierte Variable als auch für eine deklarierte, aber nicht initialisierte Variable (let x;) zurück. Das ist sowohl gut als auch schlecht. Gut – weil wir keinen Fehler abfangen. Schlecht – weil wir diese beiden Fälle nicht unterscheiden.
Beispiel für eine deklarierte, aber leere Variable
\n\nlet myVar; // deklariert, aber nicht initialisiert\nconsole.log(typeof myVar); // "undefined" – ebenfalls undefined!\n\nif (typeof myVar !== 'undefined') {\n console.log('Variable existiert und hat einen Wert');\n} else {\n console.log('Variable ist undefined (entweder nicht deklariert oder nicht initialisiert)');\n}\n\nFazit: typeof ist die ideale Lösung, wenn Sie einfach nur einen ReferenceError vermeiden müssen. Wenn Sie jedoch zwischen „nicht deklariert“ und „leer“ unterscheiden müssen, lesen Sie weiter.
Methode Nr. 2. Überprüfung über window (globaler Kontext)
\n\nWenn Sie im Browser arbeiten und die Variable global deklariert wurde (über var oder implizit), wird sie zu einer Eigenschaft des Objekts window. Dies eröffnet zusätzliche Möglichkeiten zur Überprüfung der Existenz einer Variable.
Verwendung des in-Operators
\n\n// Globale Variable\nvar globalVar = 42;\n\nconsole.log('globalVar' in window); // true\nconsole.log('nonExistentVar' in window); // false\n\nDiese Methode funktioniert nur für globale Variablen, die mit var deklariert oder ohne Schlüsselwort zugewiesen wurden. let und const erstellen keine Eigenschaften des window-Objekts (sie leben im Blockbereich).