mitmario.dev

Die Datentypen

JavaScript Im Browser 4 Min Lesezeit 3 BeispieleLektion 2 von 9

Jeder Wert in JavaScript hat einen Typ. Der Typ entscheidet, was mit dem Wert geht: Zahlen kann man multiplizieren, Texte kann man aneinanderhängen, und ein Wahrheitswert taugt als Bedingung.

Es gibt acht Sorten, und die meisten davon kennst du aus dem Alltag.

Die Übersicht

Die Typen im Überblick
console.log("Zahl:", typeof 42);
console.log("Kommazahl:", typeof 19.99);
console.log("Text:", typeof "Hallo");
console.log("Wahrheitswert:", typeof true);
console.log("Nichts angelegt:", typeof undefined);
console.log("Absichtlich leer:", typeof null);
console.log("Objekt:", typeof { name: "Mario" });
console.log("Liste:", typeof [1, 2, 3]);
console.log("Funktion:", typeof console.log);

typeof ist der Befehl, mit dem du nachsiehst. Er steht vor dem Wert, ohne Klammern, und liefert einen Text mit dem Namen des Typs.

Zahl (number). Es gibt nur eine Sorte Zahl. Ganze und gebrochene liegen im selben Typ, 42 und 19.99 sind beide number. Das ist ungewöhnlich, viele andere Sprachen trennen das. Was daraus folgt, ist Thema der nächsten Lektion.

Text (string). Alles zwischen Anführungszeichen. Auch "5" ist ein Text, obwohl eine Ziffer darin steht.

Wahrheitswert (boolean). Genau zwei Werte, true und false. Sie entstehen meistens aus einem Vergleich und sind die Grundlage jeder Entscheidung in Abschnitt 3.

Nichts, Teil eins (undefined). Das heißt „hier war nie etwas”. Es entsteht von selbst, zum Beispiel bei einem Namen, den du angelegt, aber nicht gefüllt hast.

Nichts, Teil zwei (null). Das heißt „hier ist absichtlich nichts”. Das schreibt ein Mensch hin. Der Unterschied zwischen den beiden bekommt in Lektion 2.6 eine eigene Runde, weil er zuverlässig verwechselt wird.

Objekt (object). Alles, was aus mehreren Teilen besteht: Objekte, Listen, Datumsangaben. Das ist die Sammelkategorie, und Abschnitt 6 und 7 gehören ihr.

Symbol (symbol). Ein eindeutiger Bezeichner, den man als Schlüssel benutzen kann, ohne mit anderen zu kollidieren. Du wirst ihn in diesem Kurs nicht brauchen und in normalem Code selten sehen.

Große Ganzzahl (bigint). Für Ganzzahlen, die größer sind, als der normale Zahlentyp verkraftet. Du erkennst sie am angehängten n, also 9007199254740993n. Wenn du sie brauchst, weißt du es, und bis dahin kommt sie dir nicht in die Quere.

Und was ist mit function? Sie taucht in der Liste oben auf, ist streng genommen aber ein besonderes Objekt. typeof gibt ihr trotzdem eine eigene Antwort, weil die Frage „ist das etwas, das ich aufrufen kann” so häufig ist.

Warum der Typ zählt

Der Typ ist keine Buchhaltung, er ändert das Ergebnis.

Warum der Typ zählt
// Zwei Zahlen: das Plus rechnet.
console.log(5 + 5);

// Ein Text und eine Zahl: das Plus hängt aneinander.
console.log("5" + 5);

// Die Anführungszeichen sind der ganze Unterschied.
console.log(typeof 5, typeof "5");

5 + 5 ergibt 10, "5" + 5 ergibt "55". Dasselbe Zeichen, zwei völlig verschiedene Vorgänge: einmal Addition, einmal Aneinanderhängen. Der Unterschied liegt allein in den Anführungszeichen.

Das ist nicht theoretisch. Ein Eingabefeld auf einer Webseite liefert immer Text, auch wenn type="number" daran steht. Wer zwei Eingaben addiert, ohne sie umzuwandeln, bekommt aus 5 und 5 die 55, und das ist einer der Bugs, die man einmal im Leben baut und danach nie wieder. Wie man das richtig macht, steht in Lektion 2.7.

Die zwei Macken von typeof

Die zwei Macken von typeof
// Macke eins: null ist kein Objekt, typeof sagt trotzdem "object".
console.log(typeof null);

// Macke zwei: eine Liste ist zwar ein Objekt, aber die Auskunft hilft nicht weiter.
console.log(typeof [1, 2, 3]);

// Dafür gibt es eine eigene Frage, und die antwortet klar.
console.log(Array.isArray([1, 2, 3]));
console.log(Array.isArray("kein Array"));

Beides musst du nicht glauben, es sind zwei Zeilen in der Eingabezeile der Console: typeof null antwortet mit "object", typeof [1, 2, 3] ebenfalls. Die Anführungszeichen in der Antwort gehören dabei zum Ergebnis: typeof liefert einen Text mit dem Namen des Typs, keine Sorte von Wert. Wer es auf die Spitze treiben will, tippt typeof typeof 42 und bekommt "string" zurück.

typeof null liefert "object". Das ist falsch, und alle wissen es. Der Grund ist ein Fehler in der allerersten Umsetzung von 1995: Werte wurden intern mit einer kleinen Markierung versehen, und null hatte zufällig dieselbe wie ein Objekt. Es gab tatsächlich einen Vorschlag, das zu reparieren. Er wurde abgelehnt, weil unzählige Seiten inzwischen darauf aufbauen. Der Fehler ist damit für immer Teil der Sprache.

Eine Liste sagt ebenfalls "object". Das ist nicht falsch, denn eine Liste ist ein Objekt. Es hilft nur nicht weiter, wenn du wissen willst, ob du es mit einer Liste zu tun hast. Dafür gibt es Array.isArray, und das antwortet mit true oder false.

Was du dir merken solltest

typeof ist ein Diagnosewerkzeug, kein Baustein. Du benutzt es beim Suchen eines Fehlers, um zu sehen, was da eigentlich ankommt. In fertigem Code steht es selten.

Und genau deshalb gehört es in die Eingabezeile und nicht in deine Datei. Wenn du wissen willst, was in einem Namen steckt, tippst du typeof preis und liest die Antwort. Kein console.log einbauen, kein Speichern, kein Neuladen, und danach steht auch nichts in deinem Code, was du wieder herausnehmen müsstest.

Wichtiger als der Befehl ist die Gewohnheit dahinter: Wenn eine Rechnung ein absurdes Ergebnis liefert, ist die erste Frage nicht „ist meine Formel falsch”, sondern „was für ein Wert steckt da eigentlich drin”. In neun von zehn Fällen ist es ein Text, wo eine Zahl sein sollte.

Zum Mitnehmen

typeof null liefert „object“. Das ist ein Fehler von 1995, den niemand mehr reparieren kann, ohne das halbe Web zu brechen.

Jetzt du

Basis Konto, kostenlos

Zu dieser Lektion gehört eine Aufgabe. Du schreibst den Code selbst, und nach jedem Lauf sagt dir eine Prüfliste, was schon stimmt.

Dafür brauchst du das Basis Konto. Es kostet nichts, und ein Passwort gibt es auch nicht.

Was in dieser Lektion steckt

  • Artikel mit 3 Beispielen zum Ausprobieren

    Steht hier, ohne Konto lesbar.

  • Aufgabe im Editor, direkt im Browser geprüft

    Öffnet sich mit dem Basis Konto.