JavaScript-Bausteine

In diesem Modul setzen wir unsere Behandlung aller grundlegenden Funktionen von JavaScript fort und lenken unsere Aufmerksamkeit auf häufige Arten von Codeblöcken wie bedingte Anweisungen, Schleifen, Funktionen und Ereignisse. Sie haben dieses Thema bereits im Kurs gesehen, allerdings nur flüchtig — hier besprechen wir es ausführlich.

Voraussetzungen

Bevor Sie dieses Modul beginnen, sollten Sie mit den Grundlagen von HTML und CSS vertraut sein und 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 JS Bin oder Glitch ausprobieren.

Leitfäden

Entscheidungen in Ihrem Code treffen — bedingte Anweisungen

In jeder Programmiersprache muss der Code Entscheidungen treffen und entsprechende Aktionen ausführen, abhängig von verschiedenen Eingaben. Zum Beispiel, in einem Spiel, wenn die Anzahl der Leben des Spielers 0 ist, dann ist das Spiel vorbei. In einer Wetter-App, wenn sie morgens betrachtet wird, wird eine Sonnenaufgangs-Grafik angezeigt; bei Nacht werden Sterne und ein Mond angezeigt. In diesem Artikel werden wir untersuchen, wie bedingte Strukturen in JavaScript funktionieren.

Schleifen im Code

Manchmal muss eine Aufgabe mehrmals hintereinander ausgeführt werden. Zum Beispiel beim Durchsuchen einer Namensliste. In der Programmierung erledigen Schleifen diese Aufgabe sehr gut. Hier werden wir uns Schleifenstrukturen in JavaScript ansehen.

Funktionen — wiederverwendbare Codeblöcke

Ein weiteres wesentliches Konzept beim Codieren sind Funktionen. Funktionen ermöglichen es Ihnen, ein Stück Code, das eine einzelne Aufgabe erledigt, in einem definierten Block zu speichern und diesen Code dann bei Bedarf mit einem einzigen kurzen Befehl aufzurufen — anstatt denselben Code mehrmals ausschreiben zu müssen. In diesem Artikel werden wir grundlegende Konzepte hinter Funktionen untersuchen, wie die grundlegende Syntax, wie man Funktionen aufruft und definiert, deren Geltungsbereich und Parameter.

Erstellen Sie Ihre eigene Funktion

Nachdem wir die wesentliche Theorie behandelt haben, bietet dieser Artikel eine praktische Erfahrung. Hier erhalten Sie Übung im Erstellen Ihrer eigenen benutzerdefinierten Funktion. Unterwegs erklären wir auch einige weitere nützliche Details zum Umgang mit Funktionen.

Funktionsrückgabewerte

Das letzte wesentliche Konzept, das Sie über eine Funktion wissen müssen, sind Rückgabewerte. Einige Funktionen geben nach Abschluss keinen signifikanten Wert zurück, aber andere tun es. Es ist wichtig zu verstehen, was deren Werte sind, wie Sie sie in Ihrem Code nutzen können und wie Sie Ihre eigenen benutzerdefinierten Funktionen so gestalten, dass sie nützliche Werte zurückgeben.

Einführung in Ereignisse

Ereignisse sind Aktionen oder Vorkommnisse, die in dem System passieren, das Sie programmieren, und von denen das System Sie informiert, damit Sie bei Bedarf darauf reagieren können. Wenn beispielsweise der Benutzer auf einer Webseite einen Button anklickt, möchten Sie möglicherweise auf diese Aktion reagieren, indem Sie ein Informationsfenster anzeigen. In diesem Artikel werden wir einige wichtige Konzepte im Zusammenhang mit Ereignissen besprechen und wie sie in Browsern funktionieren.

Event-Bubbling

Dieser Leitfaden führt in die Konzepte des Event-Bubblings, der Ereignisaufnahme und der Ereignisdelegation ein, die alle damit zu tun haben, was passiert, wenn Sie einen Listener an ein Element anfügen, das ein anderes Element enthält, und dann ein Ereignis am enthaltenen Element auftritt.

Bewertungen

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

Bildergalerie

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

Siehe auch

JavaScript lernen

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