Next Gen JS: Modernisiere Dein JavaScript mit ES6 und höher
Stephan Haewß
Ve esta clase y miles más
Ve esta clase y miles más
Lecciones en esta clase
-
-
1.
Kursvorstellung
2:14
-
2.
Warum ES6? Kann ich nicht beim guten alten JavaScript bleiben?
6:49
-
3.
Entwicklungsumgebung einrichten
6:11
-
4.
Variablendeklaration mit let und const versus var
18:49
-
5.
Arrays durchlaufen mit for of
13:24
-
6.
Arrow Functions
19:14
-
7.
Optionale Funktionsparameter
10:39
-
8.
Destructuring
12:04
-
9.
Rest Parameter
6:58
-
10.
Rest Operator
3:56
-
11.
Rest Operator mit Objekten
4:32
-
12.
Spread Operator bei Arrays
7:22
-
13.
Spread Operator bei Objekten
7:35
-
14.
Methodendeklaration in Objektliteralen
3:28
-
15.
Nützliche und neue Stringfunktionen
18:32
-
16.
Template Literale
14:17
-
17.
Nützliche neue Array Funktionen
35:59
-
18.
Map als Wörterbuch und Key Value Store
16:04
-
19.
Promises
23:29
-
20.
Async und await
28:46
-
21.
Module
28:51
-
22.
Dynamische Importe
11:35
-
23.
Klassen mit class
8:27
-
24.
Vererbung
18:23
-
25.
Felder in Klassen
14:59
-
26.
Private Felder
8:33
-
27.
Ohne Klasse Objekte erzeugen (Alternative zu class)
33:14
-
28.
Zusammenfassung und Ausblick
9:29
-
-
- --
- Nivel principiante
- Nivel intermedio
- Nivel avanzado
- Todos los niveles
Generado por la comunidad
El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.
11
Estudiantes
--
Proyectos
Acerca de esta clase
JavaScript ist die Sprache des Web und wer ein Web-Entwickler ist oder sein möchte, muss sich zwangsläufig mit dieser Skriptsprache auseinandersetzen. Die erste Version dieser Sprache wurde mit heißer Nadel gestrickt und hatte somit einige Unzulänglichkeiten, die in den ersten Jahren auch nicht verbessert wurden. Mit der Einführung des Standards ECMA-Script 5 wurden zwar einige zaghafte kleinere Verbesserungen eingeführt, u.a. ein Strict-Mode, der einige böse Fallen der Skriptsprache unterbinden sollte.
So richtig gut wurde JavaScript aber erst mit der Einführung des ECMA-Script 6 Standards, denn hier wurden zahlreiche sehr nützliche und weitreichende Funktionalitäten definiert, die schnell von den Browserherstellern umgesetzt wurden.
Insbesondere das neue Modulsystem, die eleganten Arrow-Funktionen und die Einführung von Promises und dem async/await-Mechanismus, brachte die Skriptsprache wirklich voran. Mit den aktuellen Implementierungen in den Browsern und in NodeJs liegt nun eine Version von JavaScript vor, die sich nicht hinter anderen Programmiersprachen zu verstecken braucht.
Zahlreiche JavaScript-Frameworks wie React, VueJs, Svelte, Redux, MobX, uvm. machen regen Gebrauch von den neuen Funktionalitäten, so dass jeder, der diese Frameworks verwendet mit den neuen Funktionen von ES6 vertraut sein sollte.
Dieser Kurs soll genau diese Vertrautheit vermitteln und die wichtigsten Funktionalitäten im Detail vorstellen, so dass Du die neuen Möglichkeiten in Deiner Web-App erfolgreich verwenden kannst.
In diesem Kurs werde ich die wichtigsten ES6 Funktionen im Detail vorstellen und an Beispielen erläutern. Du wirst u.a. Folgendes lernen:
-
Variablendeklaration mit let und const
-
Arrow-Funktionen
-
Module in ES6
-
Eleganten und kurzen Code schreiben mit Destructuring
-
Rest- und Spreadoperator
-
Klassen und Vererbung mit dem class-Keyword
-
uvm.
Proyecto de clase práctica
In der Projektaufgabe wirst Du ein kleines Programm erstellen, das mindestens die folgenden ES6-Funktionen nutzt:
- Module
- Destructuring
- Template-Literale
- Async/await
- Arrow-Functions
Als Beispiel habe ich den Source-Code für eine Web-App in den Projekt-Ressourcen abgelegt, die eine JSON-Datei vom Server lädt (mit fetch) und die enthaltenen Daten anzeigt. So führst Du es aus (Terminal/Shell):
- Entpacke die Zipdatei
- Wechsle in das entpackte Verzeichnis
- Rufe "npm install" auf
- Rufe "npm run dev" auf
- In einem Browser rufe die Adresse auf, die im Terminal angegeben wird (meist http://localhost:3000)
Du kannst auch eine komplexere App entwickeln, aber Du solltest die erwähnten ES6-Funktionalitäten irgendwo verwenden. Du kannst Dein Projekt dann z.B. auf CodePen oder JSFiddle erstellen und den Link auf der Projektseite hochladen und so anderen Deine ES6-App zeigen. Oder Du lädst Screenshots vom Code hoch oder stellst es in einem Video vor.
Valoración de la clase
¿Por qué unirse a Skillshare?
Mira las galardonadas Skillshare Originals
Cada clase tiene lecciones cortas y proyectos prácticos
Tu membresía apoya a los profesores de Skillshare