JavaScript 3 — Operatoren & Typumwandlung

In dieser Lektion lernst du, wie JavaScript mit Operatoren arbeitet und wie Werte miteinander verknüpft, verglichen und umgewandelt werden. Dieses Kapitel ist besonders wichtig, weil viele typische JavaScript-Fehler direkt aus falschem Verständnis von Operatoren und Typumwandlung entstehen.

1. Was ist ein Operator?

Definition.
Ein Operator ist ein Symbol oder Schlüsselwort, das eine Operation auf einem oder mehreren Operanden ausführt (z. B. Rechnen, Vergleichen, Zuweisen).

Beispiele für Operanden sind Variablen, Literale oder Ausdrücke. 

let result = 3 + 4;

Hier ist + der Operator und 3, 4 sind die Operanden.

2. Arithmetische Operatoren

Arithmetische Operatoren werden für mathematische Berechnungen verwendet. 
let a = 10;
let b = 3;

a + b; // 13
a - b; // 7
a * b; // 30
a / b; // 3.333...
a % b; // 1
Der Modulo-Operator ist besonders nützlich für Zyklen (z. B. „jede zweite Iteration“).

3. Zuweisungsoperatoren

Zuweisungsoperatoren speichern einen Wert in einer Variablen. 
let x = 5;

x += 2; // x = 7
x -= 1; // x = 6
x *= 3; // x = 18
x /= 2; // x = 9
Kombinierte Zuweisungen sind syntaktischer Zucker, machen den Code aber oft lesbarer.

4. Inkrement und Dekrement

Mit Inkrement (++) und Dekrement (--) kann ein Wert um 1 erhöht oder verringert werden. 
let counter = 0;

counter++; // 1
counter--; // 0
Die Unterschiede zwischen counter++ und ++counter werden später relevant (Auswertungsreihenfolge).

5. Vergleichsoperatoren

Vergleichsoperatoren liefern immer einen Boolean-Wert (true oder false). 
5 == "5";   // true
5 === "5";  // false
5 !== "5";  // true
Merke: Verwende fast immer === und !==. Die losen Operatoren führen implizite Typumwandlungen durch.

6. Logische Operatoren

Logische Operatoren verknüpfen oder negieren Bedingungen. 
let age = 20;
let hasTicket = true;

age >= 18 && hasTicket; // true
age < 18 || hasTicket;  // true
!hasTicket;             // false
Logische Operatoren werden extrem häufig in Bedingungen verwendet (z. B. in if-Anweisungen).

7. String-Operatoren

Der Operator + kann auch Strings verketten. 
"Hallo " + "Welt"; // "Hallo Welt"

In Kombination mit Zahlen kann es zu impliziter Typumwandlung kommen: 

1 + "2";   // "12"
"1" + 2;   // "12"
1 + 2 + "3"; // "33"
Solche Effekte sind eine der häufigsten Fehlerquellen in JavaScript.

8. Implizite Typumwandlung (Coercion)

JavaScript wandelt Typen automatisch um, wenn ein Operator dies erfordert. 
"5" * 2;   // 10
"5" - 1;   // 4
"5" + 1;   // "51"
Nicht jeder Operator verhält sich gleich. + ist besonders speziell.

9. Explizite Typumwandlung

Explizite Typumwandlung bedeutet, dass du selbst festlegst, welcher Typ entstehen soll. 
Number("42");   // 42
String(42);     // "42"
Boolean(1);     // true
Boolean(0);     // false
Explizite Umwandlung ist klarer, sicherer und besser lesbar.

10. Truthy und Falsy Werte

Nicht-Boolean-Werte können in Bedingungen als truthy oder falsy interpretiert werden. 
false
0
""
null
undefined
NaN

Alle anderen Werte gelten als truthy.

Dieses Verhalten wird häufig in Kurzschreibweisen genutzt, kann aber auch verwirrend sein.

11. Gute Praxis

Gut: 
const count = Number(inputValue);

12. Übungen

Übung 1.
Berechne mit Variablen den Umfang und die Fläche eines Rechtecks und gib die Ergebnisse in der Konsole aus.
Übung 2.
Teste den Unterschied zwischen == und === mit Zahlen und Strings.
Übung 3.
Experimentiere mit truthy/falsy Werten in einer if-Bedingung.

13. Zusammenfassung

Wer Operatoren und Typumwandlung versteht, schreibt verlässlichen JavaScript-Code.