An der Kasse der Bäckerei
Drei Brötchen zu 0,60 €, dazu ein Gutschein über 10 Prozent. Was kostet das?
Eine Kasse rechnet das in einem Augenblick aus. Heute baust du so einen Rechner selbst, als kleines Projekt. Du brauchst dafür alles, was du bisher gelernt hast.
Am Ende dieser Lektion
Notiz
Ich kann aus Funktionen, einem Formular und einem Ereignis einen Preisrechner auf einer Webseite bauen.
Schlüsselwörter
| Begriff | Was er bedeutet | Beispiel |
|---|---|---|
| Funktion | ein benannter Block Code, der einen Wert zurückgeben kann | |
| Rückgabewert | das Ergebnis, das eine Funktion mit return liefert | |
| Rabatt | ein Preisnachlass, hier in Prozent | 10 % |
| toFixed | zeigt eine Zahl mit fester Zahl von Nachkommastellen | (5.4).toFixed(2) |
| Projekt | eine größere Aufgabe, die du in kleine Schritte teilst |
Die Zellen, die Lernende ausfüllen, bleiben in dieser Vorschau leer.
Starter: Formulare
Probier es aus
Starter: Formulare
3 FragenDeine Antworten werden hier bewertet und nicht gespeichert. Mit einem Konto bleiben deine Ergebnisse erhalten.
Ein Projekt beginnt mit einem Plan
Ein Rechner ist nicht ein großer Klumpen Code. Du teilst ihn in kleine Teile, jeder hat eine Aufgabe.
Teile, die nur rechnen, werden Funktionen. Ein anderer Teil liest das Formular. So kannst du jeden Teil einzeln prüfen.
Beispiel: der Plan für den Rechner
| Teil | Aufgabe | Kennt die Seite? |
|---|---|---|
| berechneGesamt | Preis mal Menge | nein |
| ziehRabattAb | Prozent vom Betrag abziehen | nein |
| alsEuro | Zahl als „5,40 €“ zeigen | nein |
| submit-Funktion | Felder lesen, prüfen, Ergebnis zeigen | ja |
Die Zellen, die Lernende ausfüllen, bleiben in dieser Vorschau leer.
Probiere es aus: die Rechenfunktionen
// Eine Funktion nur zum Rechnen: Sie kennt die Webseite nicht.
function berechneGesamt(einzelpreis, menge) {
return einzelpreis * menge;
}
function ziehRabattAb(betrag, prozent) {
return betrag - betrag * prozent / 100;
}
const summe = berechneGesamt(2.5, 4);
console.log(summe);
console.log(ziehRabattAb(summe, 10));
// toFixed(2) zeigt zwei Nachkommastellen, replace macht aus dem Punkt ein Komma.
console.log(ziehRabattAb(summe, 10).toFixed(2).replace('.', ',') + ' €');
Ein häufiger Fehler
Warnung
Viele ziehen die Prozentzahl direkt ab: 50 € minus 10 sind 40 €. Das ist falsch. Es stimmt nur bei 100 €. 10 Prozent von 50 € sind 5 €. Rechne erst den Rabattbetrag aus: betrag * prozent / 100. Dann ziehe ihn ab.
Kurze Prüfung: Rechnen
Probier es aus
Kurze Prüfung: Rechnen
3 FragenDeine Antworten werden hier bewertet und nicht gespeichert. Mit einem Konto bleiben deine Ergebnisse erhalten.