Mini-Projekt (Fortsetzung): Trinkgeldrechner mit Funktionen

Dauer: 45-60 Minuten (Aufgaben 1-6)
(ggf. Besprechung beim nächsten Termin)

Ziel: Funktionen anwenden und den Trinkgeldrechner refaktorieren

In diesen Übungen wenden wir das Konzept der Funktionen an. Dabei bauen wir auf dem Trinkgeldrechner aus der vorherigen Übung auf und verbessern die Struktur durch Funktionen.

Tipp: Als Ausgangspunkt kann die Datei mit der Komplettlösung aus der vorherigen Übung verwendet werden (z.B. trinkgeld-6.js). Die Ausgangsdatei ist auch als Beispiellösung in Moodle verfügbar.

Vorgehensweise: Erstelle eine neue Datei (z.B. trinkgeld-funktionen.js). Schreibe dort zunächst die Funktionen mit den Testausgaben aus Aufgaben 1-5. In Aufgabe 6 ersetzt du dann die Testausgaben durch das vollständige Hauptprogramm mit Benutzereingaben.

Zur Festigung der bisher besprochenen Konzepte sollte noch kein Coding-Agent eingesetzt werden. Ein KI-Chat kann bei Bedarf für gezielte Fragen genutzt werden — aber nicht für komplette Lösungen.

Aufgabe 1: Einfache Funktion (Einstieg)

Schreibe eine Funktion calculateTip, die den Trinkgeldbetrag berechnet:

Parameter: bill (Rechnungsbetrag), percent (Trinkgeld-Prozentsatz)
Rückgabewert: Der berechnete Trinkgeldbetrag


function calculateTip(bill, percent) {
  // Berechnung hier ergänzen
}
 
// Test:
const tip = calculateTip(100, 15);
console.log(tip); // Ausgabe: 15

Aufgabe 2: Funktion mit Ausgabe (Einstieg)

Schreibe eine Funktion displayResult, die das Ergebnis formatiert ausgibt:

Parameter: bill, tip, total
Rückgabewert: keiner (nur Ausgabe)


function displayResult(bill, tip, total) {
  // Ausgabe hier ergänzen
}
 
// Test:
displayResult(80, 12, 92);
// Erwartete Ausgabe:
// Rechnungsbetrag: 80.00
// Trinkgeld:       12.00
// Gesamtbetrag:    92.00

Tipp: Für die Formatierung auf zwei Nachkommastellen kann toFixed(2) verwendet werden.

Aufgabe 3: Validierungsfunktion (Übung)

Schreibe eine Funktion isValidInput, die prüft, ob die Eingaben gültig sind:

Parameter: bill, percent, persons
Rückgabewert: true wenn gültig, false wenn ungültig

Regeln:

bill muss größer als 0 sein
percent muss zwischen 0 und 100 liegen
persons muss größer als 0 sein


function isValidInput(bill, percent, persons) {
  // Validierung hier ergänzen
}
 
// Tests:
console.log(isValidInput(50, 15, 2));   // true
console.log(isValidInput(-10, 15, 2));  // false
console.log(isValidInput(50, 150, 2));  // false
console.log(isValidInput(50, 15, 0));   // false

Aufgabe 4: Bewertungsfunktion (Übung)

Schreibe eine Funktion getRating, die basierend auf dem Prozentsatz eine Bewertung zurückgibt:

Parameter: percent
Rückgabewert: "Sparsam", "Normal" oder "Großzügig!"

Regeln:

Unter 10%: “Sparsam”
10% bis unter 15%: “Normal”
Ab 15%: “Großzügig!”


function getRating(percent) {
  // Bewertung hier ergänzen (mit Bedingungsoperator)
}
 
// Tests:
console.log(getRating(5));   // "Sparsam"
console.log(getRating(12));  // "Normal"
console.log(getRating(20));  // "Großzügig!"

Aufgabe 5: Aufteilungsfunktion (Übung)

Schreibe eine Funktion calculatePerPerson, die den Betrag pro Person berechnet:

Parameter: total, persons
Rückgabewert: Betrag pro Person


function calculatePerPerson(total, persons) {
  // Berechnung hier ergänzen
}
 
// Test:
const perPerson = calculatePerPerson(120, 4);
console.log(perPerson); // Ausgabe: 30

Aufgabe 6: Trinkgeldrechner refaktorieren (Vertiefung)

Was bedeutet „refaktorieren”?

Refaktorieren (englisch: refactoring) bedeutet, bestehenden Code umzustrukturieren und zu verbessern, ohne sein Verhalten zu ändern.

Das Programm macht danach also genau das Gleiche wie vorher — aber der Code ist besser organisiert, lesbarer und einfacher zu warten.

Typische Refaktorierungen sind:

Code in Funktionen auslagern
Variablen besser benennen
Doppelten Code zusammenfassen

Kombiniere alle Funktionen aus den vorherigen Aufgaben zu einem vollständigen Trinkgeldrechner. Das Hauptprogramm sollte übersichtlich und gut lesbar sein.

Hinweis: Die Funktion displayResult aus Aufgabe 2 muss für die Komplettlösung um drei Parameter erweitert werden (perPerson, rating und percent).

Struktur:


import { questionFloat, questionInt } from 'readline-sync';
 
// === Funktionen ===
// (hier die Funktionen aus Aufgaben 1-5 einfügen)
 
// === Hauptprogramm ===
// Eingabe, Berechnung, Ausgabe mit Funktionsaufrufen

Warum bleibt die Eingabe im Hauptprogramm?

Wir haben für die Eingabe keine eigene Funktion erstellt.

Eine Funktion kann nur einen Wert zurückgeben. Um bill, percent und persons gemeinsam zurückzugeben, bräuchten wir ein Objekt – das lernen wir später. Deshalb bleibt die Eingabe vorerst im Hauptprogramm.

Hinweis zur Validierung: Die Funktion isValidInput gibt true oder false zurück. Um die Berechnung bei ungültigen Eingaben zu verhindern, wird eine Verzweigung mit if benötigt — dies wird in der nächsten Lektion behandelt.

Vorteile dieser Struktur:

Jede Funktion hat eine klar definierte Aufgabe
Das Hauptprogramm ist kurz und übersichtlich
Funktionen können einzeln getestet werden
Änderungen sind einfacher (z.B. andere Bewertungsgrenzen)

Zusammenfassung

🗒️

In diesen Übungen haben wir gelernt:

Funktionen deklarieren mit function name(params) { ... }
Parameter für Eingabewerte verwenden
Rückgabewerte mit return zurückgeben
Code strukturieren durch Aufteilung in kleine Funktionen
Wiederverwendbarkeit durch allgemeine Funktionen erreichen

Info für Dozent: Lösungen siehe trinkgeld2.js im Repository exercises.