Kapitel 9: Funktionen (Wiederverwendbarer Code)

Funktionen sind Blöcke von wiederverwendbarem Code. In diesem Kapitel lernen Sie alles über Funktionen.

9.1 Was sind Funktionen? Warum brauchen wir sie?

Stellen Sie sich eine Funktion wie eine Maschine vor:

• Sie geben etwas hinein (Eingabe)
• Die Maschine verarbeitet es
• Sie bekommen etwas heraus (Ausgabe)

Warum Funktionen?

Ohne Funktionen (Code-Wiederholung):

// Berechnung 1
let ergebnis1 = 10 + 20;
console.log("Ergebnis:", ergebnis1);

// Berechnung 2 (gleicher Code!)
let ergebnis2 = 30 + 40;
console.log("Ergebnis:", ergebnis2);

// Berechnung 3 (wieder gleicher Code!)
let ergebnis3 = 50 + 60;
console.log("Ergebnis:", ergebnis3);

Mit Funktionen (wiederverwendbar):

function addiere(a, b) {
    return a + b;
}

console.log("Ergebnis:", addiere(10, 20));  // 30
console.log("Ergebnis:", addiere(30, 40));  // 70
console.log("Ergebnis:", addiere(50, 60));  // 110

Vorteile von Funktionen

Vorteil	Erklärung
✅ Wiederverwendbarkeit	Einmal schreiben, oft verwenden
✅ Lesbarkeit	Code wird strukturierter
✅ Wartbarkeit	Fehler an einer Stelle beheben
✅ Modularität	Komplexe Probleme in kleine Teile zerlegen

9.2 Funktions-Deklaration und Aufruf

Funktions-Deklaration (Erstellung)

// Syntax:
function funktionsName(parameter1, parameter2) {
    // Code hier
    return ergebnis;  // Optional
}

Beispiel:

function begruesse() {
    console.log("Hallo!");
}

Funktions-Aufruf (Ausführung)

// Funktion aufrufen
begruesse();  // Ausgabe: "Hallo!"
begruesse();  // Nochmal aufrufen

Funktion mit Parametern

// Parameter: name
function begruesse(name) {
    console.log("Hallo " + name + "!");
}

// Aufruf mit Argument
begruesse("Max");      // "Hallo Max!"
begruesse("Moritz");   // "Hallo Moritz!"

9.3 Funktions-Parameter: Formalparameter und aktuelle Parameter

Begriffe verstehen

Begriff	Englisch	Erklärung	Beispiel
Formalparameter	Parameters	Platzhalter in der Funktionsdefinition	function add(a, b) ← a, b sind Formalparameter
Aktuelle Parameter	Arguments	Tatsächliche Werte beim Aufruf	add(5, 3) ← 5, 3 sind aktuelle Parameter

Beispiel mit Erklärung

// Formalparameter: a, b
function addiere(a, b) {
    return a + b;
}

// Aktuelle Parameter: 10, 20
let ergebnis1 = addiere(10, 20);
console.log(ergebnis1);  // 30

// Aktuelle Parameter: 5, 7
let ergebnis2 = addiere(5, 7);
console.log(ergebnis2);  // 12

Standardwerte für Parameter (ES6)

// Mit Standardwerten
function begruesse(name = "Gast") {
    console.log("Hallo " + name + "!");
}

begruesse("Max");   // "Hallo Max!"
begruesse();         // "Hallo Gast!" (Standardwert verwendet)

9.4 Funktions-Rückgabewert: return verwenden

Die return-Anweisung gibt einen Wert zurück und beendet die Funktion.

Grundlegende Verwendung

function multipliziere(a, b) {
    return a * b;  // Gibt das Ergebnis zurück
}

let ergebnis = multipliziere(5, 3);
console.log(ergebnis);  // 15

return beendet die Funktion

function testeReturn() {
    console.log("Zeile 1");
    return;  // Funktion hier beenden
    console.log("Zeile 2");  // Wird NIE ausgeführt!
}

testeReturn();
// Ausgabe: "Zeile 1"

Funktion ohne return

Wenn keine return-Anweisung vorhanden ist, gibt die Funktion undefined zurück.

function sageHallo() {
    console.log("Hallo!");
    // Kein return
}

let ergebnis = sageHallo();
console.log(ergebnis);  // undefined

Mehrere Werte zurückgeben (Objekt oder Array)

// Methode 1: Objekt zurückgeben
function berechnePreis(netto) {
    let mwst = netto * 0.19;
    let brutto = netto + mwst;
    return { mwst, brutto };  // Objekt
}

let preisInfo = berechnePreis(100);
console.log("MwSt.:", preisInfo.mwst);    // 19
console.log("Brutto:", preisInfo.brutto);  // 119

// Methode 2: Array zurückgeben
function minMax(arr) {
    let min = Math.min(...arr);
    let max = Math.max(...arr);
    return [min, max];  // Array
}

let ergebnis = minMax([5, 2, 8, 1]);
console.log("Min:", ergebnis[0]);  // 1
console.log("Max:", ergebnis[1]);  // 8

9.5 Anonyme Funktionen und Funktionsausdrücke

Funktions-Deklaration (Normale Funktion)

// Wird gehoisted (kann vor Deklaration aufgerufen werden)
begruesse();  // Funktioniert!

function begruesse() {
    console.log("Hallo!");
}

Funktionsausdruck (Function Expression)

// Wird NICHT gehoisted (kann NICHT vor Zuweisung aufgerufen werden)
// begruesse();  // FEHLER!

let begruesse = function() {
    console.log("Hallo!");
};

begruesse();  // Funktioniert hier

Anonyme Funktion (ohne Namen)

// Als Callback-Funktion (häufig bei Events)
setTimeout(function() {
    console.log("Dies wird nach 1 Sekunde ausgeführt");
}, 1000);

// Als Arrow Function (ES6, moderne Schreibweise)
setTimeout(() => {
    console.log("Arrow Function!");
}, 1000);

Arrow Functions (ES6) - Moderne Schreibweise

// Normale Funktion
let addiere1 = function(a, b) {
    return a + b;
};

// Arrow Function (kurz)
let addiere2 = (a, b) => {
    return a + b;
};

// Arrow Function (sehr kurz, bei einzeiligem return)
let addiere3 = (a, b) => a + b;

console.log(addiere3(5, 3));  // 8

Vorteile von Arrow Functions:

• ✅ Kürzere Schreibweise
• ✅ this wird nicht neu gebunden (wichtig bei Objekten)

9.6 Gültigkeitsbereich: Globale und lokale Variablen

Globaler Gültigkeitsbereich (Global Scope)

Variablen, die außerhalb einer Funktion deklariert sind, sind überall verfügbar.

let globalerVar = "Ich bin global";

function teste() {
    console.log(globalerVar);  // Zugriff möglich
}

teste();
console.log(globalerVar);      // Zugriff möglich

Lokaler Gültigkeitsbereich (Local Scope)

Variablen, die innerhalb einer Funktion deklariert sind, sind nur dort verfügbar.

function teste() {
    let lokaleVar = "Ich bin lokal";
    console.log(lokaleVar);  // Zugriff möglich
}

teste();
console.log(lokaleVar);  // FEHLER! Nicht definiert

Verschachtelte Gültigkeitsbereiche

let a = "Global a";

function aussen() {
    let b = "Lokal b";
    
    function innen() {
        let c = "Noch lokaler c";
        console.log(a);  // Zugriff auf global (OK)
        console.log(b);  // Zugriff auf aussen (OK)
        console.log(c);  // Zugriff auf innen (OK)
    }
    
    innen();
    console.log(c);  // FEHLER! c ist in aussen nicht definiert
}

⚠️ Wichtig: Verwenden Sie immer let oder const

// Schlecht (ohne let/const - wird global!)
function schlecht() {
    x = 10;  // x wird global (implizit)
}

// Gut (mit let/const - lokal)
function gut() {
    let x = 10;  // x ist lokal
}

9.7 Praxis: Summenfunktion / Gerade/Ungerade-Funktion

Projekt 1: Summenfunktion

// Summe von zwei Zahlen
function summe(a, b) {
    return a + b;
}

console.log(summe(5, 3));   // 8
console.log(summe(10, 20)); // 30

// Summe aller Elemente eines Arrays
function summeArray(arr) {
    let sum = 0;
    for (let i = 0; i < arr.length; i++) {
        sum += arr[i];
    }
    return sum;
}

console.log(summeArray([1, 2, 3, 4, 5]));  // 15

Projekt 2: Gerade/Ungerade prüfen

// Funktion gibt true/false zurück
function istGerade(zahl) {
    return zahl % 2 === 0;
}

console.log(istGerade(4));  // true
console.log(istGerade(7));  // false

// Alternative mit String-Rückgabe
function geradeUngerade(zahl) {
    if (zahl % 2 === 0) {
        return "gerade";
    } else {
        return "ungerade";
    }
}

console.log(geradeUngerade(4));  // "gerade"
console.log(geradeUngerade(7));  // "ungerade"

// Mit ternärem Operator (kurz)
function geradeUngeradeKurz(zahl) {
    return zahl % 2 === 0 ? "gerade" : "ungerade";
}

Projekt 3: Taschenrechner (alle Grundrechenarten)

function taschenrechner(a, b, operation) {
    switch (operation) {
        case "add":
            return a + b;
        case "sub":
            return a - b;
        case "mul":
            return a * b;
        case "div":
            if (b === 0) {
                return "Fehler: Division durch 0";
            }
            return a / b;
        default:
            return "Unbekannte Operation";
    }
}

console.log(taschenrechner(10, 5, "add"));  // 15
console.log(taschenrechner(10, 5, "sub"));  // 5
console.log(taschenrechner(10, 5, "mul"));  // 50
console.log(taschenrechner(10, 5, "div"));  // 2

📝 Zusammenfassung

In diesem Kapitel haben Sie gelernt:

• ✅ Funktionen sind wiederverwendbare Code-Blöcke
• ✅ Funktions-Deklaration: function name() { }
• ✅ Parameter vs. Argumente
• ✅ return gibt Werte zurück und beendet die Funktion
• ✅ Anonyme Funktionen und Arrow Functions
• ✅ Globaler vs. lokaler Gültigkeitsbereich
• ✅ Praxis-Projekte: Summenfunktion, Gerade/Ungerade, Taschenrechner

➡️ Nächster Schritt

Im nächsten Kapitel lernen wir Arrays - Datenstrukturen zum Speichern mehrerer Werte!

---

Übung:

1. Schreiben Sie eine Funktion, die den Durchschnitt eines Arrays berechnet
2. Schreiben Sie eine Funktion, die prüft, ob eine Zahl eine Primzahl ist
3. Schreiben Sie eine Funktion, die ein Array umkehrt
4. Testen Sie alle Funktionen in der Konsole