TypeScript für Anfänger, Teil 3: Schnittstellen

Dieses Tutorial setzt unsere Typscript -Anfängerserie fort und baut auf früheren Einführungen in die Typenkriptfunktionen, die Installation und die IDE -Vorschläge auf. Das zweite Tutorial umfasste Typenskriptionstypen und deren Fehlervorteile.

Dieser Teil konzentriert sich auf Schnittstellen. Wir werden untersuchen, wie Schnittstellen wie x und Point (mit width ) und Cuboid (Ausweitung Point mit length und height ) helfen, Objektstrukturen zu definieren. Das Cuboid -Beispiel zeigt, dass Werte für alle Eigenschaften angegeben und eine Funktion zur Berechnung des Volumens verwendet werden.

Es ist entscheidend zu beachten, dass Schnittstellen eine typecript-spezifische Funktion sind, die in JavaScript fehlt. Das Kompilieren des TypsScript -Codes führt im folgenden JavaScript -Äquivalent:

 Funktionsvolumecuboid (Quader) {
    let Volumen = couboid.length * couboid.width * couboid.height;
    console.log (`volumen: $ {volumen}`);
}

let cuboid = {x: -22, y: 28, width: 12, länge: 32, Höhe: 20};

Volumecuboid (Quader);
// Volumen: 7680

Das Tutorial berührt auch Schnitttypen und kontrastiert sie mit der Schnittstellenerweiterung. Wir untersuchen, wie ein RoundedRectangle unter Verwendung vorhandener Typen erstellt wird, wodurch die Unterschiede zwischen der Verschmelzung mehrerer Schnittstellendeklarationen (zulässig) und neu klarierenden Typen (was zu Fehlern führt) hervorgehoben wird.

Wichtigste Imbiss:

Dieses Tutorial bietet eine Grundlage für Typscript -Schnittstellen und betont ihre Rolle beim Schreiben robuster Code. Sie haben gelernt, Schnittstellen mit optionalen und schreibgeschützten Eigenschaften zu erstellen und Indexsignaturen zum Hinzufügen dynamischer Eigenschaften über die anfängliche Schnittstellendefinition hinaus zu verwenden. Für ein tieferes Verständnis finden Sie in der offiziellen Dokumentation von Typenkripten.

Das nächste Tutorial befasst sich mit den Typenkriptklassen.

Das obige ist der detaillierte Inhalt vonTypeScript für Anfänger, Teil 3: Schnittstellen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!