Prüfung auf null, undefined und leere Werte in JavaScript: Der vollständige Leitfaden

Warum die Prüfung auf null, undefined und Leerheit der Schmerz jedes JavaScript-Entwicklers ist?

Haben Sie sich schon einmal dabei ertappt, wie Sie dachten: „Warum schreibe ich schon wieder diese umständliche Konstruktion mit if (x !== null && x !== undefined && x !== '')?“ Wenn ja, sind Sie nicht allein. Die Frage „Is there a standard function to check for null, undefined, or blank variables in JavaScript?“ auf Stack Overflow hat tausende Aufrufe gesammelt. Und das ist kein Zufall.

In JavaScript gibt es keine eingebaute Funktion, die alles auf einmal prüft. Aber das bedeutet nicht, dass wir zum Leiden verdammt sind. In diesem Artikel werden wir verstehen, warum es keine solche Funktion gibt, wie wir diese Einschränkung elegant umgehen und unseren eigenen perfekten Helfer schreiben.

Bereit, das Chaos aus Prüfungen in sauberen, verständlichen Code zu verwandeln? Los geht's!

Was sind null, undefined und blank (leere Zeichenfolge) in JavaScript?

Bevor wir nach der „Wunderpille“ suchen, lassen Sie uns klären, womit wir es zu tun haben. Diese drei Konzepte sind drei verschiedene Tiere, und sie zu verwechseln ist gefährlich.

\n
• undefined — eine Variable wurde deklariert, aber ihr wurde kein Wert zugewiesen. Dies ist der „Standardwert“ von JavaScript.
\n
• null — eine Variable existiert, aber ihr wurde absichtlich „nichts“ zugewiesen. Dies ist eine bewusste Entscheidung des Entwicklers.
\n
• blank (leere Zeichenfolge) — '' oder "". Die Zeichenfolge existiert, enthält aber keine Zeichen.
\n

Der entscheidende Unterschied: null ist ein Objekt (ja, das ist ein historischer JS-Bug, der jetzt ein Feature ist), undefined ist ein spezieller Typ, und eine leere Zeichenfolge ist eine Zeichenfolge.

let a; // undefined\nlet b = null; // null\nlet c = ''; // leere Zeichenfolge (blank)\nconsole.log(typeof a); // "undefined"\nconsole.log(typeof b); // "object" (ja, so ist es!)\nconsole.log(typeof c); // "string"

Stellen Sie sich nun vor: Sie möchten prüfen, ob eine Variable in irgendeinem Sinne „leer“ ist. Eine einfache Prüfung if (!value) funktioniert für null und undefined, aber berücksichtigt sie die leere Zeichenfolge nicht? Doch, das tut sie! Denn eine leere Zeichenfolge ist ein falsy-Wert. Aber es gibt einen Haken...

Warum ist einfach if (!value) eine schlechte Idee?

Ja, if (!value) fängt null, undefined, '', 0, false und NaN ab. Aber was, wenn 0 oder false gültige Werte für Ihre Variable sind? Wenn Sie beispielsweise die Anzahl der Artikel im Warenkorb prüfen, ist 0 normal und keine „Leerheit“.

function processOrder(itemCount) {\n    if (!itemCount) {\n        console.log('Fehler: Keine Artikel!');\n    } else {\n        console.log('Bestellung wird bearbeitet...');\n    }\n}\nprocessOrder(0); // Fehler: Keine Artikel! — Das ist aber kein Fehler, es sind 0 Artikel

Deshalb brauchen wir eine spezialisierte Funktion und keine universelle Prüfung auf „Wahrhaftigkeit“.

Standardfunktion? Nein, aber es gibt Standardmuster

Auf die Frage „Is there a standard function?“ lautet die Antwort nein. Aber JavaScript bietet flexible Werkzeuge, damit Sie Ihre eigene schreiben können. Und das ist sogar besser, weil Ihre Funktion genau Ihren Geschäftsanforderungen entspricht.

Variante 1: Einfachste Prüfung (strikt)

Wenn Sie nur auf null und undefined prüfen müssen, verwenden Sie den strikten Vergleich (===). Dies ist der sicherste Weg.

function isNullOrUndefined(value) {\n    return value === null || value === undefined;\n}\n\nconsole.log(isNullOrUndefined(null)); // true\nconsole.log(isNullOrUndefined(undefined)); // true\nconsole.log(isNullOrUndefined('')); // false\nconsole.log(isNullOrUndefined(0)); // false

Vorteil: Verwechselt 0 und leere Zeichenfolge nicht mit „nichts“. Nachteil: Prüft nicht auf lee