Comment simplifier le code TypeScript à l'aide de certains types de services de base

TypeScript est un langage de programmation conçu pour exécuter des projets JavaScript massifs, conçu par Microsoft. Par exemple, des outils tels qu'Azure Management Portal avec 1.2 million de lignes de code et Visual Studio Code avec 300 XNUMX lignes de code sont tous programmés à l'aide de TypeScript. TypeScript offre plusieurs fonctionnalités pour prendre en charge des projets JavaScript plus volumineux, telles que de meilleurs outils de développement, la vérification de type lors de la compilation et la documentation au niveau du code.

TypeScript vous permet d'ajouter un typage statique à votre base de code. Avec son puissant système de typage, TypeScript offre une meilleure lisibilité du code et la capacité de détecter les erreurs au moment de la compilation.

L'un des aspects les plus utiles de TypeScript est les types d'utilitaires intégrés, qui peuvent simplifier vos efforts de programmation et vous faire gagner un temps de développement précieux. Jetez un œil aux types d'utilitaires TypeScript incontournables qui peuvent vous aider à écrire facilement du code sécurisé. Vérifier Les meilleures applications open source pour l'édition HTML WYSIWYG.

Comment simplifier le code TypeScript à l'aide de certains types de services de base - Apprentissage

1. Types de services partiels

Le partiel (type utilitaire) de TypeScript vous permet de rendre facultatives toutes les propriétés d'un objet. Vous permet de créer des objets avec certaines propriétés qui peuvent être manquantes ou non définies. Prends pour exemple:

interface User { 
 name: string; 
 age: number; 
 email: string;
}

Avec les types Service partiel, vous pouvez créer un nouveau type avec toutes les propriétés de l'interface utilisateur définies comme facultatives :

type OptionalUser = Partial<User>

Maintenant, vous pouvez instancier un OptionalUser avec seulement quelques propriétés définies :

const user: OptionalUser = { name: “John” };

Vous pouvez rencontrer des situations où vous devez créer un objet avec certaines propriétés facultatives. Cela peut être utile en particulier lors de la création de formulaires avec plusieurs champs, car tous ne sont peut-être pas obligatoires et dans de tels cas, les types partiels peuvent être vitaux.

2. Type de service

Le type de service Pick de TypeScript peut vous aider à créer un nouveau type en sélectionnant uniquement un sous-ensemble de propriétés à partir d'un type existant. Il est utile lorsque vous devez restreindre un objet plus grand à quelques propriétés requises ou si vous souhaitez imposer une saisie stricte sur les propriétés dont vous avez besoin.

interface User { 
 location: string;
 age: number; 
 email: string;
}

type PersonWithoutEmail = Pick<User, ‘location’ | ‘age’>;

const person: PersonWithoutEmail = { 
 location: ‘USA’, 
 age: 30 
};

Dans cet exemple, l'interface nommée User définit trois propriétés : email, age et location.

en utilisant le type de service Pick Vous pouvez extraire de manière sélective les propriétés Location et Age de l'interface utilisateur, ce qui crée un nouveau type appelé PersonWithoutEmail.

Vous pouvez ensuite créer une nouvelle instance de type "PersonWithoutEmail" et définir des valeurs uniquement pour les propriétés "PersonWithoutEmail" et "Age". Comme la propriété "email" est omise de ce type, vous ne pouvez pas l'affecter à l'objet.

Avec le type de service Pick, vous pouvez créer un nouveau type qui inclut uniquement les propriétés souhaitées. Cela peut aider à rendre votre code plus lisible et plus facile à utiliser.

3. Type de service en lecture seule

Le type de service Readonly indique que les attributs d'un objet ne peuvent pas être modifiés après sa création. Ce type garantit la cohérence à long terme des données d'objet, ce qui se traduit par un traitement de code plus fluide et plus sûr.

interface User {
 readonly name: string; 
 readonly age: number; 
 readonly email: string;
}

Utilisation Le type de service en lecture seule , vous pouvez créer un nouveau type avec toutes les propriétés de l'interface utilisateur définies en lecture seule :

type ReadonlyUser = Readonly<User>

Vous pouvez spécifier des valeurs de propriété lors de l'instanciation de ReadonlyUser ::

const user: ReadonlyUser = { 
 name: “John”, 
 age: 30, 
 email: “john@example.com” 
};

Lorsque vous marquez les propriétés d'un élément en lecture seule, il devient impossible d'essayer de modifier les valeurs de ces propriétés :

user.name = “Jane”;
// Error: Cannot assign to ‘name’ because it is a read-only property.

Le type de service Readonly est particulièrement important dans les situations où vous souhaitez vous assurer qu'un objet particulier ne change pas, quelle que soit sa référence. Par exemple, si vous avez un objet qui contient des paramètres de configuration importants, vous souhaiterez peut-être vous assurer qu'ils restent inchangés.

4. Type de service requis

Ce type garantit que toutes les propriétés de base d'un objet existent, tandis que le type de service Partiel offre plus de flexibilité en vous permettant de spécifier un sous-ensemble de propriétés tout en laissant les autres propriétés facultatives. Cela peut être utile dans les situations où certaines fonctionnalités peuvent ne pas être nécessaires ou sujettes à modification.

interface User {
 name: string; 
 location: number; 
 address: string;
}

Par l'utilisation de Type de service Obligatoire , il est possible de créer un nouveau type qui collecte tous les attributs de l'interface utilisateur et nécessite que chacune de ces propriétés soit présente. RequiredUser ne peut être instancié qu'une fois toutes ses propriétés définies correctement.

const user: RequiredUser = { 
 name: “John Doe”, 
 location: “USA”, 
 address: “Kansas 9745–0622” 
};

L'utilisation du type de service Requis garantit que toutes les propriétés requises sont présentes dans l'objet.

5. Type de service Omettre

Le type de service Omit vous permet de créer un nouveau type en excluant certaines propriétés d'un type existant.

interface Person {
 location: string; 
 age: number;
 email: string;
}

type PersonWithoutEmail = Omit<Person, ‘email’>;
const person:PersonWithoutEmail = { location: “USA”; age : 30 };

L'interface Personne contient trois propriétés : l'âge, l'emplacement et l'adresse e-mail. Le type PersonWithoutEmail utilise le type de service Omit pour inclure toutes les propriétés de l'objet Person, à l'exception de l'e-mail. Vous pouvez ensuite instancier ce nouveau type, sans spécifier de valeur pour la propriété email.

Vous devez garder à l'esprit que le type Omit Servant partage de nombreuses similitudes avec le type Pick Servant, en ce sens qu'il vous permet d'inventer un nouveau type en utilisant uniquement les propriétés que vous spécifiez.

6. Enregistrement du type de service

Vous pouvez utiliser le type de service Record pour définir le type d'un objet pour lequel les clés et les valeurs ont un type attribué. Sa définition est :

type Record<K extends keyof any, T> = { [P in K]: T;};

Ce type associe T à la valeur de chaque clé, tandis que K est l'union des clés de n'importe quel type. L'objet résultant a le type de sa propriété P défini sur T.

Considérez un scénario de type d'objet avec des clés de chaîne et des valeurs numériques. Dans ce cas, vous pouvez appliquer le type Type de service Enregistrement Comme suit:

type MyRecord = Record<string, number>;

const myObject: MyRecord = { 
 “foo”: 1, 
 “bar”: 2, 
 “baz”: 3,
}

Cet exemple définit MyRecord comme un type d'objet avec des clés de chaîne et des valeurs numériques. myObject est un modèle de ce type, avec les clés 'foo', 'bar' et 'baz' affectées à leurs valeurs correspondantes. Vérifier Les meilleurs outils gratuits et payants de surveillance des changements de contenu de sites Web.

Simplifiez votre code avec les types de service TypeScript

Cet article a révélé l'incroyable puissance des types de services dans TypeScript - ils peuvent être un atout inestimable lorsqu'il s'agit de simplifier votre code et de rendre le développement plus rapide et plus efficace. Ces types d'outils, et TypeScript en général, peuvent faire des merveilles pour s'assurer que votre code est toujours exempt de bogues et respecte certaines structures. Vous pouvez voir maintenant Comment devenir professeur de programmation indépendant.

Aller au bouton supérieur