Was ist JavaScript? Grundlagen und Einstieg
Autor: Redaktion Domeny.ForSale Veröffentlicht Aktualisiert
Kurz gesagt: JavaScript ist eine Programmiersprache, die unter anderem für interaktive Websites und Webanwendungen verwendet wird. Sie ermöglicht es, auf Klicks zu reagieren, Formulare zu prüfen und Inhalte zu aktualisieren, ohne die gesamte Seite neu zu laden. Sie läuft nicht nur im Browser: In einer geeigneten Umgebung lässt sie sich auch auf dem Server einsetzen.
Welche Rolle spielt JavaScript auf einer Website?
Am einfachsten lässt sich JavaScript im Vergleich mit zwei anderen Webtechnologien verstehen. HTML beschreibt die Struktur und Bedeutung der Inhalte, etwa einer Überschrift, eines Formulars oder einer Schaltfläche. CSS bestimmt das Erscheinungsbild: Farben, Abstände, Layout und einen Teil der Animationen. JavaScript ergänzt die Logik, also Anweisungen, die festlegen, was in einer bestimmten Situation passieren soll.
Stell dir einen Versandkostenrechner in einem Onlineshop vor. HTML stellt das Eingabefeld für die Postleitzahl und den Bereich für das Ergebnis bereit. CSS gestaltet diese Elemente, und JavaScript liest den eingegebenen Wert aus und zeigt den entsprechenden Betrag an. Benötigt die Berechnung Daten aus dem Shop, kann das Skript eine Anfrage an den Server senden und dessen Antwort anzeigen.
Nicht jede Interaktion erfordert JavaScript. Ein gewöhnlicher Link, das Absenden eines Formulars oder manche aufklappbaren Elemente funktionieren auch allein mit HTML. JavaScript wird dann benötigt, wenn das Verhalten der Seite zusätzliche Logik erfordert und es nicht nur um die Darstellung von Inhalten geht.
Wo läuft JavaScript und wozu dient es?
Webbrowser verfügen über eine Engine für JavaScript, also einen Mechanismus, der den Code dieser Sprache ausführt. Nutzer müssen deshalb kein separates Programm installieren, um die in JavaScript geschriebenen Funktionen einer Website zu nutzen. Der Browser stellt Skripten außerdem Werkzeuge für den Zugriff auf das Dokument, die Verarbeitung von Ereignissen und die Netzwerkkommunikation bereit.
In diesem Zusammenhang ist häufig vom DOM die Rede, dem Dokumentobjektmodell. Es bildet die Seite so ab, dass ein Programm sie auslesen und verändern kann. Über das DOM kann JavaScript den Text einer Meldung ändern, einer Liste ein Element hinzufügen oder auf einen Klick auf eine Schaltfläche reagieren.
Typische Einsatzbereiche von JavaScript sind:
- das Filtern und Sortieren von Produktlisten;
- Vorschläge während der Texteingabe in einer Suchfunktion;
- die Prüfung von Formularfeldern vor dem Absenden;
- das Aktualisieren von Daten in Dashboards und Webanwendungen;
- die Steuerung von Karten, Medienplayern und anderen interaktiven Komponenten.
JavaScript kann auch außerhalb des Browsers laufen, zum Beispiel in Node.js. Diese Laufzeitumgebung ermöglicht es, Code auf einem Server oder Computer auszuführen. Dort kann er Anfragen bearbeiten, Dateien verarbeiten und mit einer Datenbank kommunizieren. Die Möglichkeiten eines Programms hängen also nicht nur von der Sprache ab, sondern auch von der Umgebung, in der es ausgeführt wird.
Wie sieht einfacher Code in JavaScript aus?
Code in JavaScript beschreibt Abläufe unter anderem mithilfe von Variablen, Bedingungen und Funktionen. Eine Variable speichert einen Wert, eine Bedingung ermöglicht die Auswahl eines Ablaufs, und eine Funktion fasst Anweisungen zusammen, die sich mehrfach ausführen lassen.
Dieses Beispiel prüft, ob eine Bestellung den für die Demonstration festgelegten Mindestwert für kostenlosen Versand erreicht:
const warenkorbWert = 180;
const grenzeFuerKostenlosenVersand = 200;
if (warenkorbWert >= grenzeFuerKostenlosenVersand) {
console.log("Der Versand ist kostenlos.");
} else {
const fehlenderBetrag = grenzeFuerKostenlosenVersand - warenkorbWert;
console.log(`Für kostenlosen Versand fehlen noch ${fehlenderBetrag} PLN.`);
}
const legt eine Variable an, der später kein neuer Wert zugewiesen werden kann. Die Anweisung if prüft die Bedingung, und else legt fest, was geschieht, wenn sie nicht erfüllt ist. console.log gibt eine Meldung in der Konsole aus, nicht direkt auf der Seite.
Mit den angegebenen Werten zeigt das Programm eine Meldung mit der Bedeutung: „Für kostenlosen Versand fehlen noch 20 zł.“ Du kannst das Beispiel in der Konsole der Entwicklertools deines Browsers ausführen, anschließend den Warenkorbwert auf 220 ändern und den Unterschied prüfen. Das Beispiel veranschaulicht die Logik; es ist keine fertige Lösung für die Abrechnung in einem echten Onlineshop.
Was ist JavaScript nicht und wo liegen seine Grenzen?
JavaScript und Java sind eigenständige Programmiersprachen. Die ähnlichen Namen bedeuten nicht, dass sich Code der einen Sprache als Code der anderen ausführen lässt. Um JavaScript zu lernen, brauchst du keine Vorkenntnisse in Java.
Auch React, Vue und Angular sind keine anderen Bezeichnungen für JavaScript. Es handelt sich um Bibliotheken oder Frameworks, also Werkzeuge, die das Entwickeln von Anwendungen erleichtern. Bevor du sie lernst, solltest du die Grundlagen der Sprache selbst beherrschen. So kannst du nachvollziehen, welches Verhalten auf JavaScript zurückgeht und welches auf das verwendete Werkzeug.
Code, der im Browser läuft, sollte nicht die einzige Absicherung wichtiger Vorgänge sein. Nutzer können seine Ausführung verändern oder umgehen. Deshalb muss der Server unter anderem Berechtigungen, Preise und übermittelte Daten selbst prüfen. In Code, der an den Browser gesendet wird, gehören außerdem keine Geheimnisse wie private Zugangsschlüssel.
Zu viele Skripte können dazu führen, dass eine Seite verzögert reagiert. Setze JavaScript deshalb am besten gezielt dort ein, wo es gebraucht wird, statt funktionierende Lösungen mit HTML und CSS ohne klaren Nutzen zu ersetzen.
Wie beginnst du mit dem Lernen von JavaScript?
Für die ersten Übungen reichen ein Browser und ein Texteditor. Wenn du Websites erstellen möchtest, beginne mit den Grundlagen von HTML und CSS. Lerne anschließend Variablen, Datentypen, Bedingungen, Funktionen, Arrays und die Verarbeitung von Ereignissen in JavaScript kennen.
Als erstes kleines Projekt eignet sich ein Klickzähler oder ein Rechner, der zwei Zahlen addiert. Achte darauf, dass das Programm auch mit einem leeren Eingabefeld und einem ungültigen Wert umgehen kann. Bei dieser Übung lernst du nicht nur, Code zu schreiben, sondern auch vorauszusehen, was Nutzer tatsächlich tun werden.
Siehe auch: Was ist API?
