TypeScript-Einführungsvideo [kann auch ohne JavaScript-Lernen verstanden werden]

Einführung

Erste Erfahrungen mit Typoskript

Was ist Javascript?

Was ist Typoskript?

Vorteile von Typescript im Vergleich zu js

Entwicklungstools (vscode)

Entwicklungstools (Node.js)

Warum sollten wir ein Toolkit zum Parsen von TS installieren?

Installieren Sie das Toolkit zum Parsen von TS

Die erste TS-Datei

Vereinfachen Sie die Schritte zur Durchführung von TS

Kommentar

Ausgabeanweisung

Zusammenfassung der ersten Erfahrungen mit Typoskript

Eine Einführung in Variablen und Datentypen

Was ist eine Variable?

Verwendung von Variablen

Konfigurieren Sie vscode

Typanmerkung

Benennungsregeln und Spezifikationen

Übungen mit Variablen (Austausch der Werte zweier Variablen)

Übersicht über die Datentypen

Numerischer Typ

String-Typ

Boolescher Typ

unterdefinierte und Nulltypen

Grundtypen – Zusammenfassung

Einführung in die Operatoren

Arithmetische Operatoren

Das Pluszeichen implementiert die Zeichenfolgenverkettung

Gedanken, die durch das Pluszeichen verursacht werden

Zuweisungsoperator

Inkrement- und Dekrementoperatoren

Vergleichsoperator

Logische Operatoren

Einführung in die Erklärung

Übersicht über bedingte Anweisungen

if-Anweisung

else-Anweisung

if else-Anweisungspraxis

Übersicht über den ternären Operator

Übungen mit dem ternären Operator

Übersicht über Schleifenanweisungen

Schauen Sie sich den Aufbau der for-Schleife am Beispiel des Hausaufgabenschreibens an

Grundlegende Verwendung der for-Schleife

Der Ausführungsprozess der for-Schleife

Debuggen von Haltepunkten, um den Ausführungsprozess der for-Schleife anzuzeigen

vscode-Breakpoint-Debugging-Konfiguration (1 Konfigurationsschritt)

vscode-Breakpoint-Debugging-Konfiguration (2 Debugging-Tipps)

Für Schleifenübungen (1 Druck 1-5)

Übungen in der for-Schleife (2 geben das n-te Brötchen aus, das gegessen wird)

Für Schleifenübungen (3 Berechnen Sie die Summe von 1-100)

Schlüsselwort break

Schlüsselwort fortsetzen

Einführung in Arrays

Array-Übersicht

Erstellen Sie ein Array (Syntax 1)

Erstellen Sie ein Array (Syntax 2)

Array-Länge und Index

Array-Werterfassung und -speicherung (Werterfassung)

Erfassung und Speicherung von Array-Werten (Speicherwert)

Elemente zum Array hinzufügen

Iterieren Sie über das Array (der Standardwert des Rechners ist 0).

Durchlaufen Sie das Array (die Beurteilungsbedingung ist die Länge des Arrays minus 1)

Durchlaufen des Arrays (Optimierung der Beurteilungsbedingungen)

Array-Übungen (Ermitteln der Summe aller Elemente in einem Array)

Array-Übungen (Ermitteln des Maximalwerts in einem Array)

Array-Übungen (Elemente in einem Array finden, die nicht 0 sind)

Einführung in die Funktionsgrundlagen

Funktionsübersicht

Funktionsnutzung

Funktionsübungen

Übersicht über die Funktionsparameter

Formalparameter und Aktualparameter

Zusätzliche Beschreibung der Parameter

Funktionsparameterübungen (1)

Funktionsparameterübungen (2)

Übersicht über die Rückgabewerte der Funktion

Grundlegende Verwendung von Funktionsrückgabewerten

Übung zum Funktionsrückgabewert (Änderung der getSum-Funktion)

Übung zum Funktionsrückgabewert (Dreiecksbereich)

Übung zum Funktionsrückgabewert (Ermitteln des Maximalwerts)

Beschreibung der Rückgabe

Zusammenfassung der Funktionsgrundlagen

Erweiterte Einführung in Funktionen

Funktions-Debugging (Grundoperationen)

Funktions-Debugging (Funktionsausführungsprozess)

Variablenbereich

Objekteinführung

Objektübersicht

Objekt erstellen

Schnittstelle (Typanmerkung des Objekts)

Geben Sie Anmerkungen für Objektmethoden ein

Nutzung der Schnittstelle

Objektwert

Objektspeicherwert

Zusammenfassung der grundlegenden Verwendung von Objekten

Übersicht über integrierte Objekte

Array-Objekt (Längeneigenschaft)

Array-Objekt (Push)

Array-Objekt (forEach)

Array-Objekt (Erklärung von forEach)

forEach-Übungen

Array-Objekt (einige)

Typinferenz von TS

Ein Überblick über die Grundlagen der Webentwicklung

Grundlegende Verwendung von HTML (erstellen Sie die erste HTML-Seite und verwenden Sie sie)

Grundlegende Verwendung von HTML (gemeinsame Tags)

Grundlegende Verwendung von CSS (Stilattribut)

Grundlegende Verwendung von CSS (Style-Tag)

Grundlegende Verwendung von CSS (CSS-Datei)

Verwenden Sie Javascript in Ihrem Browser

Verwenden Sie das Live Server-Plugin – aktualisieren Sie den Browser automatisch

Führen Sie TS im Browser aus

Übersicht über die DOM-Manipulation

Elemente abrufen (querySelector)

TS-Typ-Behauptung

Elemente abrufen (querySelectorAll)

Textinhalt bearbeiten (innerText)

Übung (querySelectorAll und innerText)

Operationsstil (Stilattribut)

Operationsdemonstration (classList-Attribut)

Operationsereignis (addEventListener-Ereignis hinzufügen)

Operationsereignis (Ereignisobjekt)

RemoveEventListener entfernt Ereignisse (1)

RemoveEventListener entfernt Ereignisse (2)

Zwei Hinweise zu Event-Handlern in Form von Funktionsdeklarationen

Demonstration des Schachspiels und Einführung in das Gameplay

Beschreibung der Spielvorlage

Zellklick (Schach spielen)

Zellklick (optimiert)

Passen Sie vscode und die Position des Browserfensters an

Spieler wechseln(1)

Spieler wechseln (2)

Grundlegende Verwendung von Aufzählungen

Nummernaufzählung und Stringaufzählung

Ändern Sie den aktuellen Player mithilfe einer Enumeration

Die Idee, den Sieg zu beurteilen

Analysieren Sie das Gewinner-Array

Beschreibung der Zellenelementliste

Kapselung der Gewinnfunktion

Implementieren Sie die Gewinnfunktion (1)

Implementieren Sie die Gewinnfunktion (2)

Optimieren Sie die Gewinnfunktion

Bestimmen Sie ein Unentschieden

Gewinninformationen anzeigen

Spiel neu starten

Optimieren Sie das Spiel neu