Dynamisches Skripten mit JavaScript

Bevor Sie mit diesem Modul beginnen, benötigen Sie keine Vorkenntnisse in JavaScript, aber Sie sollten die vorherigen Module des Kurses durchgearbeitet haben. Sie sollten zumindest HTML und die grundlegenden Grundlagen von CSS kennen.

Was ist JavaScript?

Willkommen bei dem MDN-Anfängerkurs für JavaScript! In diesem ersten Artikel betrachten wir JavaScript aus einer hohen Perspektive, beantworten Fragen wie "Was ist es?", und "Was macht es?", und stellen sicher, dass Sie mit dem Zweck von JavaScript vertraut sind.

Ein erster Sprung in JavaScript

Jetzt, da Sie etwas über die Theorie von JavaScript und das, was Sie damit machen können, gelernt haben, werden wir Ihnen einen Schnellkurs zu den grundlegenden Funktionen von JavaScript in einem komplett praktischen Tutorial geben. Hier bauen Sie ein einfaches "Errate die Zahl"-Spiel Schritt für Schritt auf.

Was ist schiefgelaufen? Fehlerbehebung in JavaScript

Als Sie das "Errate die Zahl"-Spiel im vorherigen Artikel aufgebaut haben, haben Sie möglicherweise festgestellt, dass es nicht funktionierte. Keine Sorge — dieser Artikel hat das Ziel, Sie davor zu bewahren, bei solchen Problemen zu verzweifeln, indem er Ihnen einige einfache Tipps gibt, wie Sie Fehler in JavaScript-Programmen finden und beheben können.

Speichern der benötigten Informationen — Variablen

Nach der Lektüre der letzten Artikel sollten Sie nun wissen, was JavaScript ist, was es für Sie tun kann, wie Sie es zusammen mit anderen Webtechnologien verwenden und wie seine Hauptfunktionen aus einer hohen Perspektive aussehen. In diesem Artikel gehen wir auf die wirklichen Grundlagen ein und betrachten, wie man mit den grundlegendsten Bausteinen von JavaScript arbeitet — Variablen.

Grundlegende Mathematik in JavaScript — Zahlen und Operatoren

An diesem Punkt im Kurs besprechen wir Mathematik in JavaScript — wie wir Operatoren und andere Funktionen kombinieren können, um erfolgreich Zahlen nach unserem Willen zu manipulieren.

Umgang mit Text — Strings in JavaScript

Als nächstes richten wir unsere Aufmerksamkeit auf Strings — so werden Textstücke in der Programmierung genannt. In diesem Artikel betrachten wir alle üblichen Dinge, die Sie wirklich über Strings wissen sollten, wenn Sie JavaScript lernen, wie das Erstellen von Strings, das Escapen von Anführungszeichen in Strings und das Zusammenfügen von Strings.

Nützliche String-Methoden

Nachdem wir uns die Grundlagen von Strings angesehen haben, schalten wir einen Gang höher und überlegen, welche nützlichen Operationen wir mit eingebauten Methoden an Strings durchführen können, wie das Finden der Länge eines Text-Strings, das Zusammenfügen und Aufteilen von Strings, das Ersetzen eines Zeichens in einem String durch ein anderes und mehr.

Arrays

In dieser Lektion betrachten wir Arrays — eine clevere Möglichkeit, eine Liste von Datenelementen unter einem einzigen Variablennamen zu speichern. Hier betrachten wir, warum dies nützlich ist, und erkunden, wie man ein Array erstellt, Elemente speichert, hinzufügt und entfernt und mehr.

Herausforderung: Unsinnsgeschichtengenerator ^{Herausforderung}

In dieser Herausforderung sollen Sie einige der Kenntnisse, die Sie in den Artikeln dieses Moduls erworben haben, anwenden, um eine lustige App zu erstellen, die zufällige Unsinnsgeschichten generiert. Viel Spaß!

Entscheidungen in Ihrem Code treffen — Bedingte Anweisungen

In jeder Programmiersprache muss der Code Entscheidungen treffen und entsprechend der unterschiedlichen Eingaben Aktionen ausführen. 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, zeigt sie eine Sonnenaufgangsgrafik; zeigt Sterne und einen Mond, wenn es Nacht ist. In diesem Artikel werden wir untersuchen, wie sogenannte bedingte Anweisungen in JavaScript funktionieren.

Schleifen im Code

Programmiersprachen sind sehr nützlich, um sich wiederholende Aufgaben schnell zu erledigen, von mehreren einfachen Berechnungen bis hin zu nahezu jeder anderen Situation, in der Sie viele ähnliche Arbeiten zu erledigen haben. Hier sehen wir uns die Schleifenstrukturen an, die in JavaScript zur Verfügung stehen und solche Bedürfnisse erfüllen.

Funktionen — Wiederverwendbare Codeblöcke

Ein weiteres wesentliches Konzept in der Programmierung sind Funktionen, die es Ihnen ermöglichen, ein Stück Code, das eine einzelne Aufgabe erfüllt, in einem definierten Block zu speichern und diesen Code immer dann aufzurufen, wenn Sie ihn mit einem einzigen kurzen Befehl benötigen - anstatt denselben Code mehrfach ausführen zu müssen. In diesem Artikel werden wir grundlegende Konzepte hinter Funktionen erkunden, wie grundlegende Syntax, wie man sie aufruft und definiert, Gültigkeitsbereich und Parameter.

Erstellen Sie Ihre eigene Funktion

Mit den meisten der wichtigen Theorien, die im vorherigen Artikel behandelt wurden, bietet dieser Artikel praktische Erfahrung. Hier werden Sie etwas Übung darin bekommen, Ihre eigene, angepasste Funktion zu erstellen. Dabei erklären wir auch einige nützliche Details im Umgang mit Funktionen.

Rückgabewerte von Funktionen

Es gibt noch ein letztes wesentliches Konzept über Funktionen, das wir besprechen müssen — Rückgabewerte. Einige Funktionen geben keinen bedeutenden Wert zurück, andere jedoch schon. Es ist wichtig zu verstehen, was ihre Werte sind, wie man sie im eigenen Code verwendet und wie man Funktionen nützliche Werte zurückgeben lässt. All das werden wir unten behandeln.

Einführung in Ereignisse

In diesem Artikel behandeln wir einige wichtige Konzepte rund um Ereignisse und betrachten die Grundlagen, wie sie in Browsern funktionieren.

Ereignis-Bubbling

Dieser Artikel führt die Konzepte des Ereignis-Bubblings, der Ereignis-Erfassung und der Ereignis-Delegierung ein, die alle darüber handeln, was passiert, wenn Sie einem Element einen Listener hinzufügen, das ein anderes Element enthält und dann ein Ereignis bei dem enthaltenen Element eintritt.

Herausforderung: Bildergalerie ^{Herausforderung}

Nachdem wir uns die grundlegenden Bausteine von JavaScript angesehen haben, werden wir Ihr Wissen über Schleifen, Funktionen, bedingte Anweisungen und Ereignisse testen, indem wir Sie eine auf JavaScript basierende Bildergalerie erstellen lassen, die Sie auf vielen Websites sehen werden.

Objektgrundlagen

In diesem Artikel schauen wir uns die grundlegende Syntax von JavaScript-Objekten an und gehen nochmals auf einige JavaScript-Features ein, die wir bereits im Kurs gesehen haben, und betonen die Tatsache, dass viele der schon behandelten Funktionen Objekte sind.

Einführung ins DOM-Scripting

Beim Schreiben von Webseiten und Apps gehört es zu den häufigsten Aufgaben, die Dokumentstruktur in irgendeiner Weise zu ändern. Dies wird in der Regel durch das Manipulieren des Document Object Model (DOM) über eine Reihe von integrierten Browser-APIs zur Steuerung von HTML und Styling-Informationen erreicht. In diesem Artikel führen wir Sie in das DOM-Scripting ein.

Netzwerkanfragen mit JavaScript machen

Eine weitere sehr häufige Aufgabe in modernen Websites und Anwendungen ist die Durchführung von Netzwerkanfragen, um einzelne Datenelemente vom Server abzurufen, um Abschnitte einer Webseite zu aktualisieren, ohne eine komplette neue Seite laden zu müssen. Dieses kleine Detail hatte einen großen Einfluss auf die Leistung und das Verhalten von Websites, daher erklären wir in diesem Artikel das Konzept und betrachten Technologien, die dies möglich machen.

Arbeiten mit JSON

JavaScript Object Notation (JSON) ist ein standardisiertes textbasiertes Format zur Darstellung von strukturierten Daten, das auf der JavaScript-Objektsyntax basiert. Es wird häufig zur Datenübertragung in Webanwendungen verwendet (z. B. zum Senden von Daten vom Server an den Kunden, damit sie auf einer Webseite angezeigt werden können, oder umgekehrt). Sie werden oft darauf stoßen, also geben wir Ihnen in diesem Artikel alles, was Sie benötigen, um mit JSON unter Verwendung von JavaScript zu arbeiten, einschließlich des Parsens von JSON, damit Sie auf die Daten darin zugreifen können, sowie des Erstellens von JSON.

JavaScript-Debugging und Fehlerbehandlung

In dieser Lektion kehren wir zum Thema Debugging von JavaScript zurück (das wir erstmals in Was ist schiefgelaufen? angesehen haben). Hier tauchen wir tiefer in Techniken zum Aufspüren von Fehlern ein, betrachten aber auch, wie man fehlerfrei programmiert und Fehler im Code behandelt, um Probleme im Vorfeld zu vermeiden.

Testen Sie Ihr Wissen: JavaScript

Diese Seite listet JavaScript-Tests auf, die Sie ausprobieren können, um zu überprüfen, ob Sie den Inhalt dieses Moduls verstanden haben.

Scrimba: JavaScript lernen ^{MDN-Lernpartner}

Scrimbas JavaScript lernen Kurs lehrt Ihnen JavaScript durch das Lösen von über 140 interaktiven Coding-Herausforderungen, das Erstellen von Projekten einschließlich eines Spiels, einer Browser-Erweiterung und sogar einer mobilen App. Scrimba bietet unterhaltsame interaktive Lektionen, die von sachkundigen Lehrern unterrichtet werden.

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 Einmalzahlung erhältlich.

• Übersicht: Kernlernmodule
• Weiter