Wahr, falsch, nichts

Drei Werte, die nichts miteinander zu tun haben und trotzdem oft verwechselt werden. Diese Lektion sortiert sie.

01 / 05Wahrheitswerte

Ein Wahrheitswert hat genau zwei Zustände: true und false. Beide ohne Anführungszeichen, denn "true" mit Anführungszeichen ist ein Text und etwas ganz anderes.

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

// Direkt hinschreiben geht, kommt aber selten vor.
const istAngemeldet = true;
console.log("Direkt gesetzt:", istAngemeldet);

// Der Normalfall: der Wert fällt bei einem Vergleich an.
const alter = 17;
const istVolljaehrig = alter >= 18;
console.log("Aus einem Vergleich:", istVolljaehrig);

const warenkorbInCent = 4500;
console.log("Versandfrei:", warenkorbInCent >= 4000);

Du kannst true direkt hinschreiben, und manchmal tut man das auch. Der Normalfall ist aber ein anderer: Wahrheitswerte fallen bei Vergleichen an. alter >= 18 ist eine Frage, und die Antwort ist true oder false.

Genau deshalb ist der Wahrheitswert der wichtigste der drei. Er ist die Zutat, aus der Abschnitt 3 Entscheidungen baut: Wenn dieser Wert wahr ist, mach das eine, sonst das andere.

Und deshalb lohnt sich die Namensregel aus Lektion 2.1: Ein Name wie istVolljaehrig oder hatRabatt liest sich in einer Bedingung wie ein deutscher Satz. flag und check tun das nicht.

02 / 05undefined: hier war nie etwas

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

// Ein Name ohne Wert: den Namen gibt es, gefüllt ist er nicht.
let ergebnis;
console.log("Nie gefüllt:", ergebnis);

// Eine Funktion ohne return liefert ebenfalls undefined.
function machNichts() {}
console.log("Ohne return:", machNichts());

// Und eine Eigenschaft, die es am Objekt nicht gibt, auch.
const person = { name: "Mario" };
console.log("Gibt es nicht:", person.alter);

undefined bedeutet: Es gibt eine Stelle, aber niemand hat je etwas hineingelegt.

Das Entscheidende daran ist, dass es von selbst entsteht. Du schreibst es fast nie hin, du bekommst es. Drei Wege sind die häufigsten:

Ein Name, den du mit let angelegt, aber nicht gefüllt hast. Eine Funktion, die kein return hat, gibt undefined zurück. Und der Zugriff auf eine Eigenschaft, die es an einem Objekt nicht gibt, liefert ebenfalls undefined.

Der letzte Fall wird dich ab Abschnitt 7 am häufigsten treffen. Er ist auch der unangenehmste, weil er still ist: Du bekommst keine Fehlermeldung, du bekommst undefined, rechnest damit weiter und stehst am Ende vor einem NaN.

03 / 05null: hier ist absichtlich nichts

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

// "Hier ist absichtlich nichts, und das ist so gemeint."
let ausgewaehlterKurs = null;
console.log("Nichts ausgewählt:", ausgewaehlterKurs);

// Später kommt etwas hinein.
ausgewaehlterKurs = "JavaScript";
console.log("Jetzt ausgewählt:", ausgewaehlterKurs);

// Und wieder heraus, ohne den Namen zu löschen.
ausgewaehlterKurs = null;
console.log("Wieder leer:", ausgewaehlterKurs);

null bedeutet: Hier steht bewusst nichts, und das ist der richtige Zustand.

Der Unterschied zu undefined ist keine Spitzfindigkeit, sondern eine Aussage über die Absicht. Ein Formularfeld, in das noch niemand etwas eingetragen hat, ist undefined. Eine Auswahl, die jemand ausdrücklich zurückgesetzt hat, ist null.

Der Merksatz: undefined passiert, null entscheidet man.

Wo dir null in diesem Kurs zuerst begegnet, ist Abschnitt 10. document.querySelector sucht ein Element und liefert null, wenn es keins findet. Das ist bewusst gewählt: Die Funktion hat gesucht und nichts gefunden, das ist ein Ergebnis und kein Versehen. Hätte sie undefined geliefert, wüsstest du nicht, ob sie überhaupt gesucht hat.

04 / 05Was typeof dazu sagt

<h1>Ausgabe</h1>
<p>Was dieses Beispiel tut, steht in der Console.</p>

const wahr = 10 > 3;
const falsch = 10 < 3;
let nieGefuellt;
const absichtlichLeer = null;

console.log(wahr, typeof wahr);
console.log(falsch, typeof falsch);
console.log(nieGefuellt, typeof nieGefuellt);
console.log(absichtlichLeer, typeof absichtlichLeer);

Vier Werte, vier Zeilen mit Wert und Typ. Drei davon sind unauffällig, einer nicht.

typeof null liefert "object". Das ist die Macke aus Lektion 2.2, und hier siehst du, warum sie stört: Ausgerechnet an der Stelle, an der du null von undefined unterscheiden willst, gibt typeof dir eine Antwort, die auf beides passen könnte.

Die praktische Folge: Frag nicht mit typeof nach null. Frag direkt, ob der Wert null ist. Wie das genau geht und warum es dafür drei Gleichheitszeichen braucht, ist Lektion 3.2. Dort lernst du auch einen kleinen Trick kennen: wert == null mit zwei Zeichen trifft null und undefined zugleich, und das ist eine der wenigen Stellen, an denen die lose Form die richtige ist.

Den Trick kannst du dir schon jetzt ansehen, dafür brauchst du Lektion 3.2 nicht. Tipp undefined == null in die Eingabezeile der Console, und die Antwort ist true. Tipp danach undefined === null mit drei Zeichen, und die Antwort ist false. Zwei Zeilen, die sich um ein Zeichen unterscheiden und um alles andere auch.

05 / 05Warum das jetzt schon wichtig ist

Diese drei Werte sehen nach Buchhaltung aus. Sie sind der Grund für die Hälfte aller Fehler, die Anfänger nicht erklären können.

Steht in deiner Anzeige plötzlich undefined, dann hast du eine Eigenschaft abgefragt, die es nicht gibt, oder eine Funktion benutzt, die nichts zurückgibt. Steht null da, war jemand vor dir am Werk und hat es absichtlich geleert, oder eine Suche ist ins Leere gelaufen. Und bekommst du Cannot read properties of null, dann arbeitest du mit dem Ergebnis einer Suche, die nichts gefunden hat.

Wer die drei auseinanderhält, liest solche Meldungen wie eine Wegbeschreibung.