Skip to content

Kapitel 6: Operatoren

Operatoren sind Werkzeuge zum Rechnen, Vergleichen und Verknüpfen von Werten. In diesem Kapitel lernen Sie alle wichtigen Operatoren kennen.

6.1 Arithmetische Operatoren: + - * / % ++ --

Diese Operatoren werden für mathematische Berechnungen verwendet.

Grundlegende Arithmetik

javascript
let a = 10;
let b = 3;

console.log(a + b);  // 13 (Addition)
console.log(a - b);  // 7  (Subtraktion)
console.log(a * b);  // 30 (Multiplikation)
console.log(a / b);  // 3.333... (Division)
console.log(a % b);  // 1  (Modulo - Rest der Division)

Modulo-Operator (%) - Sehr wichtig!

javascript
// Gerade oder ungerade Zahl prüfen
console.log(10 % 2);  // 0 (gerade)
console.log(11 % 2);  // 1 (ungerade)

// Alle 5 Schritte etwas tun
for (let i = 0; i < 20; i++) {
    if (i % 5 === 0) {
        console.log(i, "ist durch 5 teilbar");
    }
}

Inkrement (++) und Dekrement (--)

javascript
let x = 5;

// Post-Inkrement (gibt alten Wert zurück, dann erhöhen)
console.log(x++);  // 5
console.log(x);     // 6

// Pre-Inkrement (erhöhen, dann neuen Wert zurückgeben)
let y = 5;
console.log(++y);  // 6
console.log(y);     // 6

// Dekrement (verringern)
let z = 5;
console.log(--z);  // 4
console.log(z--);  // 4
console.log(z);     // 3

Praxis-Beispiel: Preisberechnung

javascript
let preis = 100;
let mwst = 0.19;
let rabatt = 10;

let preisNachRabatt = preis - rabatt;
let endpreis = preisNachRabatt * (1 + mwst);

console.log("Endpreis:", endpreis.toFixed(2), "€");

6.2 Zuweisungsoperatoren: = += -= *= /=

Zuweisungsoperatoren kombinieren eine Operation mit einer Zuweisung.

Grundlegende Zuweisung

javascript
let x = 10;  // Einfache Zuweisung

Verkürzte Schreibweise

javascript
let punkte = 100;

// Lang (ausführlich):
punkte = punkte + 50;

// Kurz (verkürzt):
punkte += 50;  // Gleiches wie: punkte = punkte + 50

// Alle Varianten:
let y = 10;
y += 5;   // y = y + 5    → 15
y -= 3;   // y = y - 3    → 12
y *= 2;   // y = y * 2    → 24
y /= 4;   // y = y / 4    → 6
y %= 4;   // y = y % 4    → 2

Praxis-Beispiel: Punktestand

javascript
let punkte = 0;

// Spieler bekommt Punkte
punkte += 100;   // +100 Punkte
console.log(punkte);  // 100

// Spieler verliert Punkte
punkte -= 30;    // -30 Punkte
console.log(punkte);  // 70

// Bonus-Multiplikator
punkte *= 2;     // x2
console.log(punkte);  // 140

6.3 Vergleichsoperatoren: > < >= <= == === != !==

Vergleichsoperatoren geben einen Boolean-Wert (true oder false) zurück.

Einfache Vergleiche

javascript
console.log(5 > 3);    // true
console.log(5 < 3);    // false
console.log(5 >= 5);   // true
console.log(5 <= 3);   // false

== vs === (SEHR WICHTIG!)

javascript
// == (lose Gleichheit - konvertiert Typen)
console.log(5 == "5");   // true ⚠️ (String "5" wird zu Number 5 konvertiert)
console.log(1 == true);   // true ⚠️ (true wird zu 1 konvertiert)
console.log(0 == false);  // true ⚠️ (false wird zu 0 konvertiert)

// === (strenge Gleichheit - kein Typen-Check)
console.log(5 === "5");   // false ✅ (verschiedene Typen)
console.log(1 === true);   // false ✅
console.log(0 === false);  // false ✅

Empfehlung: Immer === verwenden!

Ungleich-Operatoren

javascript
// != (lose Ungleichheit)
console.log(5 != "5");   // false ⚠️

// !== (strenge Ungleichheit) - EMPFOHLEN!
console.log(5 !== "5");   // true ✅

Praxis-Beispiel: Altersprüfung

javascript
let alter = 18;

if (alter >= 18) {
    console.log("Sie sind volljährig!");
} else {
    console.log("Sie sind minderjährig.");
}

// Passwort-Länge prüfen
let passwort = "12345";
if (passwort.length >= 8) {
    console.log("Passwort ist sicher.");
} else {
    console.log("Passwort ist zu kurz!");
}

6.4 Logische Operatoren: && || ! (Und/Oder/Nicht)

Logische Operatoren verknüpfen mehrere Bedingungen.

UND-Operator (&&)

Beide Bedingungen müssen true sein.

javascript
let alter = 25;
let hatFuehrerschein = true;

if (alter >= 18 && hatFuehrerschein) {
    console.log("Sie dürfen Auto fahren.");
} else {
    console.log("Sie dürfen nicht Auto fahren.");
}

Wahrheitstabelle für &&:

ABA && B
truetruetrue
truefalsefalse
falsetruefalse
falsefalsefalse

ODER-Operator (||)

Mindestens eine Bedingung muss true sein.

javascript
let istWochenende = true;
let istFeiertag = false;

if (istWochenende || istFeiertag) {
    console.log("Keine Arbeit heute!");
}

Wahrheitstabelle für ||:

ABA || B
truetruetrue
truefalsetrue
falsetruetrue
falsefalsefalse

NICHT-Operator (!)

Kehrt den Wahrheitswert um.

javascript
let istEingeloggt = false;

if (!istEingeloggt) {
    console.log("Bitte loggen Sie sich ein.");
}

// Beispiele:
console.log(!true);    // false
console.log(!false);   // true
console.log(!!"Hallo");  // true (Truthy zu Boolean)

Praxis-Beispiel: Rabatt-Berechnung

javascript
let alter = 65;
let istStudent = false;
let istMitglied = true;

// Rabatt, wenn: alter > 60 ODER Student ODER Mitglied
if (alter > 60 || istStudent || istMitglied) {
    console.log("Sie erhalten 20% Rabatt!");
} else {
    console.log("Kein Rabatt verfügbar.");
}

6.5 Operator-Precedence (Einfache Merkregel)

Wie in der Mathematik: Manche Operatoren werden vor anderen ausgewertet.

Die wichtigsten Regeln

javascript
// 1. Klammern zuerst
let ergebnis1 = (2 + 3) * 4;  // 20 (nicht 14!)

// 2. Multiplikation/Division vor Addition/Subtraktion
let ergebnis2 = 2 + 3 * 4;    // 14 (nicht 20!)

// 3. Vergleiche vor logischen Operatoren
let ergebnis3 = 5 > 3 && 2 < 4;  // true && true = true

// 4. Zuweisung (=) ist immer am schwächsten
let x = 5 + 3 * 2;  // x = 11 (nicht 16!)

Tabelle der Operator-Precedence (vereinfacht)

PrecedenceOperatoren
1 (höchste)(), [], .
2!, ++, --
3*, /, %
4+, -
5>, <, >=, <=
6==, ===, !=, !==
7&&
8||
9 (niedrigste)=, +=, -=, etc.

Tipps zur Vermeidung von Fehlern

javascript
// Unklar:
let ergebnis = 5 + 3 * 2 > 10 && true;

// Klar (mit Klammern):
let ergebnis = ((5 + (3 * 2)) > 10) && true;

// Noch besser: Auf mehrere Zeilen aufteilen
let summe = 5 + (3 * 2);
let istGross = summe > 10;
let ergebnis = istGross && true;

📝 Zusammenfassung

In diesem Kapitel haben Sie gelernt:

  • ✅ Arithmetische Operatoren: +, -, *, /, %, ++, --
  • ✅ Zuweisungsoperatoren: =, +=, -=, *=, /=
  • ✅ Vergleichsoperatoren: >, <, >=, <=, ===, !== (Immer === verwenden!)
  • ✅ Logische Operatoren: && (Und), || (Oder), ! (Nicht)
  • ✅ Operator-Precedence: Klammern zuerst, dann Punktrechnung, dann Strichrechnung

➡️ Nächster Schritt

Im nächsten Kapitel lernen wir bedingte Anweisungen (if, else, switch) - die es Ihrem Code erlauben, Entscheidungen zu treffen!


Übung:

  1. Erstellen Sie eine HTML-Datei mit JavaScript
  2. Rechnen Sie Preise mit MwSt. und Rabatt
  3. Prüfen Sie, ob eine Zahl gerade oder ungerade ist (% Operator)
  4. Verwenden Sie logische Operatoren, um komplexe Bedingungen zu prüfen
  5. Geben Sie alle Ergebnisse in der Konsole aus

Frei für alle Anfänger