Appearance
Kapitel 5: Datentypen
JavaScript hat verschiedene Datentypen, um unterschiedliche Arten von Informationen zu speichern. In diesem Kapitel lernen Sie alle wichtigen Datentypen kennen.
5.1 Grundlegende Datentypen (5 Kern-Datentypen)
JavaScript unterscheidet zwischen primiven und komplexen Datentypen.
1. Number (Zahlen)
javascript
let alter = 25; // Ganze Zahl
let preis = 19.99; // Dezimalzahl
let temperatur = -5; // Negative Zahl
console.log(typeof alter); // "number"
console.log(typeof preis); // "number"Besonderheiten:
- ✅ Kein Unterschied zwischen Ganzzahlen und Dezimalzahlen
- ✅ Erlaubt: Positive/negative Zahlen, Dezimalzahlen
- ⚠️
Infinity(unendlich),-Infinity,NaN(Not a Number)
javascript
let x = 10 / 0;
console.log(x); // Infinity
let y = "Hallo" / 2;
console.log(y); // NaN2. String (Zeichenketten)
javascript
let name = "Max"; // Mit doppelten Anführungszeichen
let stadt = 'Berlin'; // Mit einfachen Anführungszeichen
let text = `Hallo ${name}`; // Mit Backticks (Template Literals)
console.log(typeof name); // "string"Template Literals (Empfohlen):
javascript
let vorname = "Max";
let nachname = "Mustermann";
let alter = 25;
// Alt (schlecht):
let begruessung1 = "Hallo " + vorname + " " + nachname + ", du bist " + alter + " Jahre alt.";
// Neu (gut - Template Literals):
let begruessung2 = `Hallo ${vorname} ${nachname}, du bist ${alter} Jahre alt.`;3. Boolean (Wahrheitswert)
javascript
let istAngemeldet = true;
let istMinderjaehrig = false;
console.log(typeof istAngemeldet); // "boolean"Verwendung:
- ✅ Bedingte Anweisungen (
if) - ✅ Schleifen (
while) - ✅ Flag-Variablen
4. Null (Leerer Wert)
javascript
let benutzer = null; // Absichtlich leer
console.log(typeof benutzer); // "object" (eigentlich ein Bug in JavaScript)Wann verwendet man null?
- ✅ Wenn eine Variable absichtlich leer sein soll
- ✅ Um eine Variable "zurückzusetzen"
5. Undefined (Nicht definiert)
javascript
let x;
console.log(x); // undefined
console.log(typeof x); // "undefined"Unterschied zwischen null und undefined:
null | undefined |
|---|---|
| Absichtlich leer | Nicht zugewiesen |
| Programmierer setzt Wert | JavaScript setzt Wert |
5.2 Datentyp-Erkennung: typeof Operator
Der typeof Operator gibt den Datentyp einer Variable zurück.
Grundlegende Verwendung
javascript
console.log(typeof 42); // "number"
console.log(typeof "Hallo"); // "string"
console.log(typeof true); // "boolean"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object" (Bug!)
console.log(typeof Symbol()); // "symbol"
console.log(typeof 123n); // "bigint"
console.log(typeof function(){}); // "function"
console.log(typeof {}); // "object"
console.log(typeof []); // "object"Überraschungen mit typeof
javascript
// Achtung: Diese sind überraschend!
console.log(typeof null); // "object" (eigentlich ein Fehler in JS)
console.log(typeof []); // "object" (Array ist ein Objekt)
console.log(typeof NaN); // "number" (😱 NaN ist eine Zahl?!)Bessere Methoden zur Typüberprüfung:
javascript
// Für Arrays
Array.isArray([1, 2, 3]); // true
// Für null
x === null; // true, wenn x null ist
// Für NaN
isNaN(NaN); // true
Number.isNaN(NaN); // true (besser!)5.3 Datentyp-Konvertierung
JavaScript kann Datentypen automatisch oder manuell konvertieren.
1. String zu Number
javascript
// Methode 1: Number()
let str1 = "123";
let num1 = Number(str1);
console.log(num1); // 123
console.log(typeof num1); // "number"
// Methode 2: parseFloat() / parseInt()
let str2 = "3.14";
let num2 = parseFloat(str2);
console.log(num2); // 3.14
let str3 = "100";
let num3 = parseInt(str3);
console.log(num3); // 100
// Methode 3: Unäre Plus-Operator (Kurzform)
let str4 = "42";
let num4 = +str4;
console.log(num4); // 422. Number zu String
javascript
// Methode 1: toString()
let zahl = 123;
let text1 = zahl.toString();
console.log(text1); // "123"
console.log(typeof text1); // "string"
// Methode 2: String()
let text2 = String(zahl);
console.log(text2); // "123"
// Methode 3: Template Literal (empfohlen!)
let text3 = `${zahl}`;
console.log(text3); // "123"3. Zu Boolean konvertieren
javascript
// Falsy-Werte (werden zu false):
Boolean(0); // false
Boolean(""); // false
Boolean(null); // false
Boolean(undefined);// false
Boolean(NaN); // false
// Truthy-Werte (werden zu true):
Boolean(1); // true
Boolean("Hallo"); // true
Boolean([]); // true (leeres Array ist truthy!)
Boolean({}); // true (leeres Objekt ist truthy!)Kurzform mit !!:
javascript
let x = "Hallo";
console.log(!!x); // true
let y = 0;
console.log(!!y); // false5.4 Anfänger-Fehler: Häufige Typfehler
Fehler 1: Strings und Zahlen addieren
javascript
// Problem:
let alter = 25;
let text = "Ich bin " + alter + " Jahre alt.";
console.log(text); // "Ich bin 25 Jahre alt." ✅ (funktioniert)
// Aber:
let zahl1 = "10";
let zahl2 = 5;
let ergebnis = zahl1 + zahl2;
console.log(ergebnis); // "105" ❌ (String-Konkatenation!)Lösung:
javascript
let zahl1 = "10";
let zahl2 = 5;
let ergebnis = Number(zahl1) + zahl2;
console.log(ergebnis); // 15 ✅Fehler 2: == vs ===
javascript
// == (lose Gleichheit - konvertiert Typen)
console.log(5 == "5"); // true ⚠️
console.log(1 == true); // true ⚠️
console.log(0 == false); // true ⚠️
// === (strenge Gleichheit - kein Typen-Check)
console.log(5 === "5"); // false ✅
console.log(1 === true); // false ✅
console.log(0 === false); // false ✅Empfehlung: Immer === verwenden!
Fehler 3: null und undefined verwechseln
javascript
// Falsch:
if (benutzer === null) {
// Prüft nur auf null, nicht auf undefined
}
// Richtig:
if (benutzer == null) {
// Prüft auf null UND undefined ✅
}📝 Zusammenfassung
In diesem Kapitel haben Sie gelernt:
- ✅ 5 Grund-Datentypen: Number, String, Boolean, Null, Undefined
- ✅
typeofgibt den Datentyp zurück (mit Überraschungen!) - ✅ Datentyp-Konvertierung:
Number(),String(),Boolean() - ✅ Häufige Fehler: String + Zahl,
==vs=== - ✅ Immer
===statt==verwenden - ✅ Template Literals für String-Interpolation verwenden
➡️ Nächster Schritt
Im nächsten Kapitel lernen wir Operatoren - Werkzeuge zum Rechnen und Vergleichen!
Übung:
- Erstellen Sie Variablen verschiedener Datentypen
- Überprüfen Sie ihre Typen mit
typeof - Konvertieren Sie einen String zu einer Zahl und addieren Sie ihn
- Experimentieren Sie mit
==und=== - Geben Sie alle Ergebnisse in der Konsole aus
