Dynamisches Scripting 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 beim JavaScript-Einsteigerkurs von MDN! In diesem ersten Artikel betrachten wir JavaScript aus einer höheren Perspektive und beantworten Fragen wie "Was ist es?" und "Was macht es?", um sicherzustellen, dass Sie sich mit dem Zweck von JavaScript wohlfühlen.

Ein erster Sprung in JavaScript

Nachdem Sie etwas über die Theorie von JavaScript gelernt haben und was Sie damit machen können, geben wir Ihnen nun einen Crashkurs über die grundlegenden Funktionen von JavaScript in einem völlig praktischen Tutorial. Hier bauen Sie schrittweise ein einfaches "Rate die Zahl"-Spiel auf.

Was ist schiefgelaufen? Fehlerbehebung in JavaScript

Beim Aufbau des "Rate die Zahl"-Spiels im vorherigen Artikel haben Sie möglicherweise festgestellt, dass es nicht funktioniert hat. Keine Sorge — dieser Artikel zielt darauf ab, Sie vor solchen Problemen zu bewahren, indem er Ihnen einige einfache Tipps zur Fehlersuche und Behebung von Fehlern in JavaScript-Programmen gibt.

Speichern der benötigten Information — Variablen

Nachdem Sie die letzten Artikel gelesen haben, sollten Sie jetzt 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 gehen wir auf die Grundlagen ein und betrachten, wie man mit den grundlegenden Bausteinen von JavaScript arbeitet — den Variablen.

Grundlegende Mathematik in JavaScript — Zahlen und Operatoren

An diesem Punkt des Kurses diskutieren wir Mathematik in JavaScript — wie wir Operatoren und andere Funktionen kombinieren können, um Zahlen erfolgreich zu manipulieren und unseren Wünschen entsprechend zu arbeiten.

Umgang mit Text — Zeichenfolgen in JavaScript

Als Nächstes widmen wir uns den Zeichenfolgen — so werden Textstücke in der Programmierung genannt. In diesem Artikel sehen wir uns alle gängigen Dinge an, die Sie über Zeichenfolgen wissen sollten, wenn Sie JavaScript lernen, wie das Erstellen von Zeichenfolgen, das Escapen von Anführungszeichen in Zeichenfolgen und das Zusammenfügen von Zeichenfolgen.

Nützliche Methoden für Zeichenfolgen

Nachdem wir uns die Grundlagen der Zeichenfolgen angesehen haben, steigen wir eine Stufe auf und beginnen zu überlegen, welche nützlichen Operationen wir mit eingebauten Methoden auf Zeichenfolgen durchführen können, wie das Finden der Länge einer Textzeichenfolge, das Zusammenfügen und Aufteilen von Zeichenfolgen, das Ersetzen eines Zeichens in einer Zeichenfolge durch ein anderes und mehr.

Arrays

In dieser Lektion sehen wir uns Arrays an — eine elegante Möglichkeit, eine Liste von Datenobjekten unter einem einzigen Variablennamen zu speichern. Wir untersuchen, warum dies nützlich ist, und erkunden, wie man ein Array erstellt, wie man gespeicherte Objekte im Array abruft, hinzufügt und entfernt und mehr.

Herausforderung: Blödsinnige 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 unsinnige Geschichten generiert. Viel Spaß!

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 Anzahl der Leben des Spielers 0 ist, ist das Spiel vorbei. In einer Wetter-App, wenn sie morgens betrachtet wird, wird eine Sonnenaufgangsgrafik angezeigt; zeigen Sie Sterne und einen Mond an, wenn es Nacht ist. In diesem Artikel werden wir ergründen, wie sogenannte bedingte Anweisungen in JavaScript funktionieren.

Code wiederholt ausführen

Programmiersprachen sind sehr nützlich für das schnelle Abschließen sich wiederholender Aufgaben, von mehreren grundlegenden Berechnungen bis hin zu praktisch jeder anderen Situation, in der Sie viele ähnliche Aufgaben zu erledigen haben. Hier sehen wir uns die im JavaScript verfügbaren Schleifenstrukturen an, die solche Anforderungen erfüllen.

Funktionen — wiederverwendbare Codeblöcke

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

Erstellen Sie Ihre eigene Funktion

Da die meisten wesentlichen Theorien im vorherigen Artikel behandelt wurden, bietet dieser Artikel praktische Erfahrung. Hier haben Sie die Gelegenheit, Ihre eigene, benutzerdefinierte Funktion zu erstellen. Dabei erklären wir auch einige nützliche Details zum Umgang mit Funktionen.

Rückgabewerte von Funktionen

Es gibt noch ein letztes wesentliches Konzept über Funktionen zu besprechen — Rückgabewerte. Einige Funktionen geben keinen bedeutenden Wert zurück, aber andere tun es. Es ist wichtig zu verstehen, was ihre Werte sind, wie man sie in Ihrem Code verwendet und wie man Funktionen nützliche Werte zurückgeben lässt. Wir werden all dies im Folgenden behandeln.

Einführung in Ereignisse

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

Ereignis-Bubbling

Dieser Artikel führt die Konzepte von Ereignis-Bubbling, Ereigniserfassung und Ereignisdelegation ein, die alle damit zu tun haben, was passiert, wenn Sie einen Listener zu einem Element hinzufügen, das ein anderes Element enthält, und ein Ereignis dann bei dem enthaltenen Element auftritt.

Herausforderung: Bildergalerie ^{Herausforderung}

Nachdem wir uns nun die grundlegenden Bausteine von JavaScript angeschaut haben, werden wir Ihr Wissen über Schleifen, Funktionen, Bedingte Anweisungen und Ereignisse testen, indem wir Sie auffordern, ein recht häufiges Element zu erstellen, das Sie auf vielen Websites sehen werden — eine JavaScript-gesteuerte Bildergalerie.

Grundlagen der Objekte

In diesem Artikel sehen wir uns die grundlegende JavaScript-Objektsyntax an und wiederholen einige JavaScript-Funktionen, die wir zuvor im Kurs gesehen haben, wobei wir darauf hinweisen, dass viele der Funktionen, mit denen Sie bereits gearbeitet haben, Objekte sind.

Einführung in das DOM Scripting

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 das Manipulieren des Document Object Model (DOM) mithilfe eines Satzes in den Browser integrierter APIs zur Steuerung von HTML und Stilinformatioonen. In diesem Artikel stellen wir Ihnen das DOM Scripting vor.

Netzwerkanfragen mit JavaScript stellen

Eine weitere sehr häufige Aufgabe in modernen Websites und Anwendungen ist das Stellen von Netzwerkanfragen, um einzelne Datenobjekte vom Server abzurufen und somit Abschnitte einer Webseite zu aktualisieren, ohne eine komplett neue Seite laden zu müssen. Diese scheinbar kleine Detail hat einen großen Einfluss auf die Leistung und das Verhalten von Seiten, und deshalb erklären wir in diesem Artikel das Konzept und betrachten die Technologien, die es möglich machen.

Arbeiten mit JSON

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

Fehlersuche und Fehlerbehandlung in JavaScript

In dieser Lektion kehren wir zum Thema JavaScript-Fehlersuche zurück, das wir erstmals in Was ist schiefgelaufen? angesprochen haben. Hier gehen wir tiefer auf Techniken zur Fehlerverfolgung ein, aber wir betrachten auch, wie Sie defensiv in Ihrem Code schreiben und Fehler handhaben können, um Probleme von vornherein zu vermeiden.

Testen Sie Ihre Fähigkeiten: 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: Learn JavaScript ^{MDN Lernpartner}

Der Scrimba's Learn JavaScript Kurs lehrt Ihnen JavaScript durch das Lösen von über 140 interaktiven Coding-Herausforderungen, das Erstellen von Projekten inklusive eines Spiels, einer Browser-Erweiterung und sogar einer mobilen App. Scrimba bietet unterhaltsame, interaktive Lektionen, die von erfahrenen Lehrkräften unterrichtet werden.

Lernen Sie JavaScript

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 komplette Kurs ist für eine kleine einmalige Zahlung verfügbar.

• Übersicht: Kernlernmodule
• Weiter