JavaScript Grundbausteine

In diesem Modul setzen wir unsere Erörterung aller grundlegenden JavaScript-Funktionen fort und konzentrieren uns auf häufig vorkommende Typen von Codeblöcken, wie bedingte Anweisungen, Schleifen, Funktionen und Ereignisse. Sie haben diese Themen bereits im Kurs kennengelernt, jedoch nur am Rande — hier werden wir alles ausführlich besprechen.

Voraussetzungen

Bevor Sie mit diesem Modul beginnen, sollten Sie mit den Grundlagen von HTML und CSS vertraut sein. Außerdem sollten Sie unser vorheriges Modul, JavaScript Erste Schritte, durchgearbeitet haben.

Hinweis: Wenn Sie an einem Computer/Tablet/anderen Gerät arbeiten, auf dem Sie keine eigenen Dateien erstellen können, könnten Sie die meisten der Codebeispiele in einem Online-Coding-Programm wie JSBin oder Glitch ausprobieren.

Leitfäden

Entscheidungen in Ihrem Code treffen — bedingte Anweisungen

In jeder Programmiersprache muss der Code Entscheidungen treffen und entsprechend auf verschiedene Eingaben reagieren. Zum Beispiel: In einem Spiel, wenn die Spieleranzahl der Leben 0 ist, dann ist das Spiel vorbei. In einer Wetter-App, wenn es morgens ist, zeigen Sie eine Sonnenaufgangsgrafik; zeigen Sie Sterne und einen Mond, wenn es Nacht ist. In diesem Artikel werden wir erkunden, wie bedingte Strukturen in JavaScript funktionieren.

Code wiederholen

Manchmal muss eine Aufgabe mehr als einmal hintereinander ausgeführt werden. Beispielsweise beim Durchsuchen einer Liste von Namen. In der Programmierung erledigen Schleifen diese Aufgabe sehr gut. Hier werden wir uns die Schleifenstrukturen in JavaScript ansehen.

Funktionen — wiederverwendbare Codeblöcke

Ein weiteres essentielles Konzept beim Codieren sind Funktionen. Funktionen ermöglichen es Ihnen, ein Stück Code, das eine einzelne Aufgabe ausführt, in einem definierten Block zu speichern und diesen Code dann jedes Mal mit einem kurzen Befehl aufzurufen, wenn Sie ihn benötigen — anstatt denselben Code mehrfach eingeben zu müssen. In diesem Artikel werden wir grundlegende Konzepte hinter Funktionen erkunden, wie die grundlegende Syntax, wie Funktionen aufgerufen und definiert werden, Geltungsbereich und Parameter.

Erstellen Sie Ihre eigene Funktion

Da die meisten wesentlichen Theorien zuvor behandelt wurden, bietet dieser Artikel eine praktische Erfahrung. Sie werden etwas Übung darin bekommen, eine eigene benutzerdefinierte Funktion zu erstellen. Unterwegs werden wir auch einige weitere nützliche Details zum Umgang mit Funktionen erklären.

Funktion Rückgabewerte

Das letzte wesentliche Konzept, das Sie über Funktionen wissen müssen, sind Rückgabewerte. Einige Funktionen geben nach Abschluss keinen signifikanten Wert zurück, andere jedoch schon. Es ist wichtig zu verstehen, was deren Werte sind, wie man sie im Code verwendet und wie Sie Ihre eigenen benutzerdefinierten Funktionen dazu bringen, nützliche Werte zurückzugeben.

Einführung in Ereignisse

Ereignisse sind Aktionen oder Vorkommnisse, die im System, das Sie programmieren, geschehen und über die das System Sie informiert, damit Sie auf irgendeine Weise darauf reagieren können, wenn Sie möchten. Zum Beispiel könnten Sie bei einem Klick des Benutzers auf einen Button auf einer Webseite auf diese Aktion reagieren, indem Sie ein Informationsfeld anzeigen. In diesem Artikel werden wir einige wichtige Konzepte rund um Ereignisse besprechen und uns ansehen, wie sie in Browsern funktionieren.

Ereignis-Bubblen

Dieser Leitfaden führt die Konzepte des Ereignis-Bubblens, der Ereignis-Eingabe und der Ereignis-Delegierung ein, die alle davon handeln, was passiert, wenn Sie einen Listener zu einem Element hinzufügen, das ein anderes Element enthält, und dann ein Ereignis für das enthaltene Element eintritt.

Bewertungen

Die folgende Bewertung wird Ihr Verständnis der JavaScript-Grundlagen testen, die in den obigen Leitfäden behandelt werden.

Bildgalerie

Da wir nun die grundlegenden Bausteine von JavaScript behandelt haben, werden wir Ihr Wissen über Schleifen, Funktionen, bedingte Anweisungen und Ereignisse testen, indem wir ein ziemlich häufiges Objekt erstellen, das Sie auf vielen Websites sehen — eine JavaScript-gestützte Bildgalerie.

Siehe auch

JavaScript lernen

Eine ausgezeichnete Ressource für angehende Webentwickler — Lernen Sie JavaScript in einer interaktiven Umgebung mit kurzen Lektionen und interaktiven Tests, geführt durch automatisierte Bewertungen. Die ersten 40 Lektionen sind kostenlos, und der vollständige Kurs ist gegen eine kleine einmalige Zahlung verfügbar.