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 bearbeitet haben. Sie sollten zumindest HTML und die grundlegenden CSS-Kenntnisse kennen.

Was ist JavaScript?

Willkommen im MDN-Anfängerkurs zu JavaScript! In diesem ersten Artikel werden wir JavaScript aus einer hohen Perspektive betrachten und Fragen wie „Was ist das?“ und „Was macht es?“ beantworten und sicherstellen, dass Sie mit dem Zweck von JavaScript vertraut sind.

Ein erster Einstieg in JavaScript

Jetzt, da Sie etwas über die Theorie von JavaScript und seine Anwendungen gelernt haben, geben wir Ihnen einen Crashkurs zu den grundlegenden Funktionen von JavaScript durch ein vollständig praktisches Tutorial. Hier werden Sie Schritt für Schritt ein einfaches „Ratespiel“ aufbauen.

Was ist schiefgegangen? Fehlerbehebung in JavaScript

Als Sie das „Ratespiel“ im vorherigen Artikel aufgebaut haben, haben Sie möglicherweise festgestellt, dass es nicht funktioniert hat. Keine Sorge – dieser Artikel soll Sie davor bewahren, verzweifelt über solch Probleme nachzudenken, indem er Ihnen einige einfache Tipps gibt, wie Sie Fehler in JavaScript-Programmen finden und beheben können.

Speicherung der benötigten Informationen — Variablen

Nach dem Lesen der letzten Artikel sollten Sie nun wissen, was JavaScript ist, was es für Sie tun kann, wie Sie es neben anderen Webtechnologien verwenden und wie seine Hauptmerkmale aus einer hohen Perspektive aussehen. In diesem Artikel werden wir uns mit den wirklichen Grundlagen befassen und untersuchen, wie man mit den grundlegendsten Bausteinen von JavaScript — Variablen — arbeitet.

Grundlegende Mathematik in JavaScript — Zahlen und Operatoren

An diesem Punkt des Kurses besprechen wir Mathematik in JavaScript — wie wir Operatoren und andere Funktionen kombinieren können, um Zahlen erfolgreich zu manipulieren.

Umgang mit Text — Zeichenketten in JavaScript

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

Nützliche Zeichenkettenmethoden

Nun, da wir die Grundlagen von Zeichenketten betrachtet haben, steigern wir das Tempo und überlegen uns, welche nützlichen Operationen wir mit integrierten Methoden an Zeichenketten ausführen können, wie z.B. das Finden der Länge einer Textzeichenkette, das Zusammenfügen und Teilen von Zeichenketten, das Ersetzen eines Zeichens in einer Zeichenkette durch ein anderes und mehr.

Arrays

In dieser Lektion werden wir Arrays betrachten — eine elegante 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 aus einem Array abruft, hinzufügt und entfernt und mehr.

Herausforderung: Verrückter Geschichtengenerator ^Challenge

In dieser Herausforderung werden Sie aufgefordert, das in den Artikeln dieses Moduls erworbene Wissen anzuwenden, um eine unterhaltsame App zu erstellen, die zufällige, verrückte Geschichten generiert. Viel Spaß!

Entscheidungen treffen im Code — Bedingte Anweisungen

In jeder Programmiersprache muss der Code Entscheidungen treffen und entsprechend unterschiedliche Aktionen basierend auf verschiedenen Eingaben 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 angesehen wird, soll eine Sonnenaufgangsgrafik angezeigt werden; bei Nacht Sterne und Mond. In diesem Artikel werden wir erkunden, wie sogenannte bedingte Anweisungen in JavaScript funktionieren.

Code-Schleifen

Programmiersprachen sind sehr nützlich, um schnell repetitive Aufgaben zu erledigen, von mehreren einfachen Berechnungen bis hin zu nahezu jeder anderen Situation, in der viele ähnliche Arbeiten zu erledigen sind. Hier werden wir die Schleifenstrukturen untersuchen, die in JavaScript zur Verfügung stehen, um solche Bedürfnisse zu befriedigen.

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 ausführt, in einem definierten Block zu speichern und dann diesen Code aufzurufen, wann immer Sie ihn benötigen, mit einem einzigen kurzen Befehl — anstatt denselben Code mehrmals eintippen 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.

Bauen Sie Ihre eigene Funktion

Nachdem die meisten theoretischen Grundlagen im vorherigen Artikel behandelt wurden, bietet dieser Artikel praktische Erfahrungen. Hier erhalten Sie etwas Übung darin, Ihre eigene, benutzerdefinierte Funktion zu erstellen. Unterwegs erklären wir auch einige nützliche Details zum Umgang mit Funktionen.

Rückgabewerte von Funktionen

Es gibt ein letztes essentielles Konzept über Funktionen, das wir besprechen müssen — Rückgabewerte. Einige Funktionen geben keinen signifikanten Wert zurück, andere jedoch schon. Es ist wichtig zu verstehen, was ihre Werte sind, wie Sie sie in Ihrem Code verwenden und wie Sie Funktionen erstellen, die nützliche Werte zurückgeben. Wir werden all dies unten 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 in die Konzepte des Ereignis-Bubbling, der Ereignisaufnahme und der Ereignisdelegation 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 auf das enthaltene Element trifft.

Herausforderung: Bildergalerie ^Challenge

Jetzt, da wir uns die grundlegenden Bausteine von JavaScript angesehen haben, werden wir Ihr Wissen über Schleifen, Funktionen, Bedingte Anweisungen und Ereignisse testen, indem wir Sie auffordern, ein ziemlich häufiges Element zu erstellen, das Sie auf vielen Websites sehen werden — eine JavaScript-unterstützte Bildergalerie.

Objektgrundlagen

In diesem Artikel werden wir uns die grundlegende JavaScript-Objektsyntax ansehen und einige JavaScript-Funktionen wiederholen, die wir bereits früher im Kurs erlebt haben, wobei wir den Fakt hervorheben, 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 eine der häufigsten Aufgaben, die Sie erledigen möchten, die Dokumentstruktur auf irgendeine Weise zu ändern. Dies wird normalerweise durch die Manipulation des Document Object Model (DOM) über eine Reihe von integrierten Browser-APIs zur Steuerung von HTML und Styling-Informationen getan. In diesem Artikel führen wir Sie in das DOM-Scripting ein.

Netzwerkanfragen mit JavaScript

Eine weitere sehr häufige Aufgabe in modernen Websites und Anwendungen ist das Stellen von Netzwerkanfragen, um einzelne Datenpunkte vom Server abzurufen und Bereiche einer Webseite zu aktualisieren, ohne eine komplett neue Seite laden zu müssen. Diese scheinbar kleine Details haben einen großen Einfluss auf die Leistung und das Verhalten von Websites. In diesem Artikel erklären wir 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 von strukturierten Daten, basierend auf JavaScript-Objekt-Syntax. Es wird häufig zum Übertragen von Daten in Webanwendungen verwendet (z.B. um Daten vom Server an den Client zu senden, damit diese 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 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 der Erstellung von JSON.

JavaScript debuggen und Fehler behandeln

In dieser Lektion kehren wir zum Thema Debugging von JavaScript zurück (das wir erstmals in Was ist schiefgegangen? betrachtet haben). Hier werden wir tiefer in Techniken eintauchen, um Fehler zu identifizieren, aber auch betrachten, wie man defensiv programmiert und Fehler im Code behandelt, um Probleme von vornherein zu vermeiden.

Scrimba: Learn JavaScript ^{MDN Learning Partner}

Scrimbas Learn JavaScript Kurs lehrt Ihnen JavaScript durch das Lösen von über 140 interaktiven Programmieraufgaben, den Aufbau 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.

Learn JavaScript

Eine ausgezeichnete Ressource für angehende Webentwickler — Lernen Sie JavaScript in einem interaktiven Umfeld, mit kurzen Lektionen und interaktiven Tests, angeleitet durch automatisierte Bewertung. Die ersten 40 Lektionen sind kostenlos, und der gesamte Kurs ist für eine geringe einmalige Zahlung verfügbar.

• Übersicht: Kernlernmodule
• Weiter