Weboberflächen
Filter, Menüs, Rechner und Diagramme bedienen.
JavaScript
verständlich erklärt.
JavaScript reagiert auf Eingaben und verarbeitet Daten. Im Browser macht es Oberflächen interaktiv; mit Laufzeitumgebungen wie Node.js kann es auch außerhalb des Browsers arbeiten.
Wofür wird
JavaScript genutzt?
Die wichtigsten Einsatzgebiete auf einen Blick – und eine Grenze, die du kennen solltest.
Daten
Antworten einer API verarbeiten und anzeigen.
Server und Werkzeuge
Dienste oder Skripte mit einer passenden Laufzeit entwickeln.
Vom Beispiel
zum Verständnis.
Erst die Aufgabe lesen, dann den Code verfolgen und schließlich eine kleine Änderung ausprobieren.
BEISPIEL 01
Nur verfügbare Angebote zeigen
Ein Katalog soll ausverkaufte Artikel ausblenden.
const artikel = [
{ name: "Helm", bestand: 3 },
{ name: "Licht", bestand: 0 }
];
const lieferbar = artikel.filter(a => a.bestand > 0);
console.log(lieferbar.map(a => a.name).join(", "));Das passiert im Code
- Das Array enthält zwei Artikelobjekte.
- filter behält nur Artikel mit positivem Bestand.
- map liest die Namen aus; join verbindet sie zu einem Text.
Erwartetes Ergebnis
Helm
Probiere es selbst
Welches Ergebnis entsteht, wenn Licht den Bestand 2 erhält?
Lösung ansehen
Helm, Licht
BEISPIEL 02
Einen Fortschritt berechnen
Eine Lernoberfläche zeigt den Anteil abgeschlossener Aufgaben.
function fortschritt(erledigt, gesamt) {
if (gesamt <= 0) return 0;
return Math.round(erledigt / gesamt * 100);
}
console.log(fortschritt(3, 8) + "%");Das passiert im Code
- Eine Funktion bündelt die Berechnung.
- Der Sonderfall gesamt <= 0 verhindert eine Division durch null.
- Math.round rundet den Prozentwert auf eine ganze Zahl.
Erwartetes Ergebnis
38%
Probiere es selbst
Berechne den Fortschritt für 6 von 8 Aufgaben.
Lösung ansehen
fortschritt(6, 8) ergibt 75. Das Beispiel erwartet sinnvolle, nicht negative Aufgabenzahlen.
Wie geht es
weiter?
Vertiefe das Thema in der Dokumentation oder vergleiche es mit einem verwandten Werkzeug.
Dokumentation zu JavaScript öffnen ↗
HTML
HTML gibt einer Webseite ihre Struktur und Bedeutung: Eine Überschrift ist eine Überschrift, ein Link führt zu einem Ziel und ein Formular erfasst Eingaben.
HTML mit BeispielenTypeScript
TypeScript ergänzt JavaScript um prüfbare Typbeschreibungen. Dadurch fallen viele unpassende Datenzugriffe schon beim Entwickeln auf. Für die Ausführung wird gewöhnlich JavaScript erzeugt.
TypeScript mit Beispielen