Dynamisches Skripting mit JavaScript

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

Was ist JavaScript?

Willkommen beim MDN-Einsteigerkurs für JavaScript! In diesem ersten Artikel betrachten wir JavaScript aus einer höheren Perspektive, beantworten Fragen wie "Was ist das?" und "Was macht es?" und stellen sicher, dass Sie den Zweck von JavaScript verstehen.

Ein erster Sprung in JavaScript

Nachdem Sie etwas über die Theorie von JavaScript und seine Anwendungsmöglichkeiten gelernt haben, geben wir Ihnen einen Crash-Kurs über die grundlegenden Funktionen von JavaScript durch ein komplett praktisches Tutorial. Hier bauen Sie Schritt für Schritt ein einfaches "Errate die Zahl"-Spiel auf.

Was ist schiefgelaufen? JavaScript-Fehlerbehebung

Beim Erstellen des "Errate die Zahl"-Spiels im vorherigen Artikel haben Sie möglicherweise festgestellt, dass es nicht funktionierte. Keine Sorge — dieser Artikel soll Sie vor Schwierigkeiten bewahren, indem er einfache Tipps bietet, wie Sie Fehler in JavaScript-Programmen finden und beheben können.

Die nötigen Informationen speichern — Variablen

Nachdem Sie die letzten Artikel gelesen haben, 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 höheren Perspektive aussehen. In diesem Artikel widmen wir uns den wirklichen Grundlagen und erläutern, 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 Zahlen erfolgreich zu manipulieren.

Textverarbeitung — Zeichenketten in JavaScript

Jetzt wenden wir unsere Aufmerksamkeit den Zeichenketten zu — so werden Textstücke in der Programmierung genannt. In diesem Artikel betrachten wir alle üblichen Dinge, die Sie über Zeichenketten wissen sollten, wenn Sie JavaScript lernen, wie das Erstellen von Zeichenketten, das Maskieren von Anführungszeichen in Zeichenketten und das Verbinden von Zeichenketten.

Nützliche Methoden für Zeichenketten

Nachdem wir uns die Grundlagen der Zeichenketten angesehen haben, erhöhen wir das Tempo und überlegen, welche nützlichen Operationen wir mit eingebauten Methoden auf Zeichenketten durchführen können, wie z.B. die Bestimmung der Länge einer Textzeichenkette, das Verbinden und Teilen von Zeichenketten, das Ersetzen eines Zeichens in einer Zeichenkette durch ein anderes und vieles mehr.

Arrays

In dieser Lektion betrachten wir Arrays — eine clevere Methode, um eine Liste von Datenpunkten unter einem einzigen Variablennamen zu speichern. Wir untersuchen, warum dies nützlich ist, und erfahren, wie man ein Array erstellt, Elemente in einem Array abruft, hinzufügt und entfernt, und mehr.

Herausforderung: Lustige Geschichtengenerator ^{Herausforderung}

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

Entscheidungen in Ihrem Code treffen — Bedingte Anweisungen

In jeder Programmiersprache muss der Code Entscheidungen treffen und entsprechend unterschiedliche Aktionen ausführen, abhängig von verschiedenen Eingaben. Zum Beispiel, in einem Spiel ist es vorbei, wenn die Lebensanzahl des Spielers 0 erreicht. In einer Wetter-App wird morgens eine Sonnenaufgangsgrafik angezeigt; bei Nacht Sterne und ein Mond. In diesem Artikel werden wir untersuchen, wie sogenannte bedingte Anweisungen in JavaScript funktionieren.

Wiederholungen im Code

Programmiersprachen sind sehr nützlich, um schnell sich wiederholende Aufgaben abzuschließen, von mehreren grundlegenden Berechnungen bis zu so gut wie jeder anderen Situation, in der Sie viele ähnliche Arbeiten zu erledigen haben. Hier betrachten wir die Schleifenstrukturen in JavaScript, die solche Anforderungen behandeln.

Funktionen — Wiederverwendbare Codeblöcke

Ein weiteres wichtiges Konzept im Coding sind Funktionen, die es Ihnen ermöglichen, ein Stück Code, das eine einzelne Aufgabe ausführt, in einem definierten Block zu speichern und diesen Code dann mit einem einzigen kurzen Befehl aufzurufen — anstatt denselben Code mehrmals eintippen zu müssen. In diesem Artikel werden wir grundlegende Konzepte von Funktionen wie grundlegende Syntax, wie man sie aufruft und definiert, Gültigkeitsbereich und Parameter erkunden.

Erstellen Sie Ihre eigene Funktion

Nachdem der größte Teil der Theorie im vorhergehenden Artikel behandelt wurde, bietet dieser Artikel praktische Erfahrung. Hier üben Sie, Ihre eigene, benutzerdefinierte Funktion zu erstellen. Unterwegs erklären wir auch einige nützliche Details im Umgang mit Funktionen.

Rückgabewerte von Funktionen

Es gibt ein letztes wichtiges Konzept über Funktionen, das wir diskutieren müssen — Rückgabewerte. Einige Funktionen geben keinen signifikanten Wert zurück, andere wiederum schon. Es ist wichtig zu verstehen, was deren Werte sind, wie sie in Ihrem Code verwendet werden und wie man Funktionen dazu bringt, nützliche Werte zurückzugeben. Wir werden all dies unten ausführlich behandeln.

Einführung in Ereignisse

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

Event-Bubbling

Dieser Artikel führt die Konzepte des Event-Bubbling, des Event-Capturing und der Event-Delegation ein, die alle darüber handeln, was passiert, wenn Sie einen Listener zu einem Element hinzufügen, das ein anderes Element enthält, und ein Ereignis dann dem enthaltenen Element widerfährt.

Herausforderung: Bildergalerie ^{Herausforderung}

Nachdem wir die grundlegenden Bausteine von JavaScript betrachtet haben, testen wir Ihr Wissen über Schleifen, Funktionen, Bedingungen und Ereignisse, indem Sie ein ziemlich übliches Element erstellen, das Sie auf vielen Websites sehen werden — eine JavaScript-basierte Bildergalerie.

Grundlagen von Objekten

In diesem Artikel betrachten wir die grundlegende Syntax von JavaScript-Objekten und wiederholen einige JavaScript-Funktionen, die wir bereits früher im Kurs gesehen haben, wobei wir erneut darauf hinweisen, dass viele der Funktionen, mit denen Sie bereits gearbeitet haben, Objekte sind.

Einführung in DOM-Skripting

Beim Schreiben von Webseiten und Apps ist es eine der häufigsten Aufgaben, die Dokumentstruktur in irgendeiner Weise zu ändern. Dies geschieht in der Regel durch Manipulation des Dokumentenobjektmodells (DOM) über eine Reihe von eingebauten Browser-APIs zur Steuerung von HTML und Stilierungsinformationen. In diesem Artikel führen wir Sie in das DOM-Skripting ein.

Netzwerkanfragen mit JavaScript ausführen

Eine weitere sehr häufige Aufgabe auf modernen Websites und Anwendungen ist das Stellen von Netzwerkanfragen, um einzelne Datenpunkte vom Server abzurufen, um Abschnitte einer Webseite zu aktualisieren, ohne eine vollständig neue Seite laden zu müssen. Dieses scheinbar kleine Detail hat einen riesigen Einfluss auf die Leistung und das Verhalten von Websites gehabt. In diesem Artikel erklären wir das Konzept und sehen uns die Technologien an, die dies möglich machen.

Arbeiten mit JSON

JavaScript Object Notation (JSON) ist ein standardisiertes textbasiertes Format zur Darstellung strukturierter Daten auf der Basis der JavaScript-Objektsyntax. Es wird häufig für die Übertragung von Daten in Webanwendungen verwendet (z. B. das Senden einiger Daten vom Server an den Client, damit sie auf einer Webseite angezeigt werden, oder umgekehrt). Sie werden darauf oft stoßen, deshalb geben wir Ihnen in diesem Artikel alles, was Sie benötigen, um mit JSON in JavaScript zu arbeiten, einschließlich des Parsens von JSON, damit Sie auf die darin enthaltenen Daten zugreifen können, und das Erstellen von JSON.

JavaScript debuggen und Fehlerbehandlung

In dieser Lektion kehren wir zum Thema des Debuggens von JavaScript zurück (das wir zuerst in Was ist schiefgelaufen? betrachtet haben). Hier tauchen wir tiefer in Techniken zur Fehlerverfolgung ein, sehen uns aber auch an, wie man defensiv kodiert und Fehler im Code behandelt, um Probleme von vornherein zu vermeiden.

Scrimba: JavaScript lernen ^{MDN Lehrplanpartner}

Der Scrimba-Kurs JavaScript lernen lehrt Ihnen JavaScript durch das Lösen von über 140 interaktiven Coding-Challenges, das Bauen 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, geführt durch automatisierte Bewertung. Die ersten 40 Lektionen sind kostenlos, und der vollständige Kurs ist gegen eine geringe Einmalzahlung verfügbar.

• Übersicht: Kernlernmodule
• Weiter