TypeScript pour les débutants, partie 3: Interfaces

Ce didacticiel poursuit notre série de débutants TypeScript, en s'appuyant sur les introductions précédentes aux fonctionnalités de type, l'installation et les suggestions IDE. Le deuxième tutoriel a couvert les types de données TypeScript et leurs avantages de prévention des erreurs.

Cette partie se concentre sur les interfaces. Nous explorerons comment les interfaces, comme x et Point (avec width ) et Cuboid ( Point d'étendue avec length et height ), aident à définir les structures d'objets. L'exemple Cuboid démontre la spécification des valeurs pour toutes les propriétés et l'utilisation d'une fonction pour calculer le volume.

Il est crucial de noter que les interfaces sont une fonctionnalité spécifique à la typeScript, absente en JavaScript. La compilation du code TypeScript entraîne l'équivalent JavaScript suivant:

 fonction volumecucuboid (cuboïde) {
    Soit Volume = Cuboid.Length * Cuboid.Width * Cuboid.Height;
    console.log (`volume: $ {volume}`);
}

Soit cuboid = {x: -22, y: 28, largeur: 12, longueur: 32, hauteur: 20};

volumecucuïde (cuboïde);
// Volume: 7680

Le tutoriel aborde également les types d'intersection, les contrastant avec l'extension d'interface. Nous examinons comment créer un RoundedRectangle en utilisant les types existants, en mettant en évidence les différences entre la fusion de plusieurs déclarations d'interface (autorisées) et les types de refonte (entraînant des erreurs).

Les principaux plats à retenir:

Ce tutoriel fournit une base dans les interfaces de typeScript, mettant l'accent sur leur rôle dans l'écriture de code robuste. Vous avez appris à créer des interfaces avec des propriétés facultatives et en lecture seule et à utiliser des signatures d'index pour ajouter des propriétés dynamiques au-delà de la définition initiale de l'interface. Pour une compréhension plus approfondie, reportez-vous à la documentation officielle de typeScript.

Le prochain tutoriel se plongera dans les classes de typeScript.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!