Objets TypeScript simplifiés pour les débutants

Les objets sont un élément fondamental de JavaScript et TypeScript. Ils vous permettent de regrouper des données et des fonctions associées, offrant ainsi un moyen de modéliser des entités du monde réel dans votre code. TypeScript améliore les objets JavaScript avec la sécurité des types, ce qui rend votre code plus prévisible et plus facile à maintenir. Ce guide simplifiera le concept des objets TypeScript pour les débutants.

Qu'est-ce qu'un objet dans TypeScript ?

Un objet est une collection de paires clé-valeur, où les clés sont des chaînes (ou des symboles) et les valeurs peuvent être de n'importe quel type. Dans TypeScript, vous pouvez définir la forme d'un objet à l'aide de types ou d'interfaces, garantissant ainsi que l'objet suit une structure spécifique.

Définition d'objets simples dans TypeScript

Commençons par définir un objet simple dans TypeScript. Cette méthode est similaire à celle utilisée pour définir des objets dans JavaScript, mais avec l'avantage supplémentaire de la sécurité des types.

Exemple d'objet de base

Voici comment définir un objet simple dans TypeScript:

const person: { name: string; age: number } = {
  name: "Alice",
  age: 25
};

console.log(person.name); // Output: Alice
console.log(person.age);  // Output: 25

Dans cet exemple, l'objet person possède deux propriétés: name (de type string) et age (de type number). TypeScript s'assurera que l'objet adhère à cette structure.

Utilisation des interfaces pour définir la structure d'un objet

Une interface est une fonctionnalité puissante de TypeScript qui définit la forme d'un objet. Les interfaces permettent de définir des contrats dans votre code, garantissant ainsi que les objets adhèrent à une structure spécifique.

Définition d'une interface

Voici comment utiliser une interface pour définir la structure d'un objet:

interface Person {
  name: string;
  age: number;
}

const person: Person = {
  name: "Bob",
  age: 30
};

console.log(person.name); // Output: Bob
console.log(person.age);  // Output: 30

Dans cet exemple, l'interface Person définit la structure d'un objet personne. La variable person doit respecter cette structure, sinon TypeScript génère une erreur.

Propriétés facultatives dans les objets

TypeScript vous permet de définir des propriétés facultatives dans les objets à l'aide du symbole ?. Les propriétés facultatives peuvent être omises lors de la création d'objets, ce qui offre une certaine flexibilité dans la manière dont vous définissez les structures d'objets.

Exemple avec propriétés facultatives

Voici un exemple où la propriété phoneNumber est facultative:

interface Employee {
  name: string;
  age: number;
  phoneNumber?: string; // Optional property
}

const employee1: Employee = {
  name: "John",
  age: 28
};

const employee2: Employee = {
  name: "Doe",
  age: 32,
  phoneNumber: "123-456-7890"
};

console.log(employee1.phoneNumber); // Output: undefined
console.log(employee2.phoneNumber); // Output: 123-456-7890

Dans cet exemple, employee1 n'a pas de propriété phoneNumber, alors que employee2 en a une. Les deux sont valides selon l'interface Employee.

Propriétés en lecture seule dans les objets

TypeScript vous permet de rendre les propriétés en lecture seule, ce qui empêche leur modification après la création de l'objet. Cela est utile pour créer des objets immuables.

Exemple avec des propriétés en lecture seule

Voici comment définir les propriétés en lecture seule:

interface Car {
  readonly brand: string;
  model: string;
}

const car: Car = {
  brand: "Toyota",
  model: "Camry"
};

// car.brand = "Honda"; // Error: Cannot assign to 'brand' because it is a read-only property

car.model = "Corolla"; // Valid
console.log(car.model); // Output: Corolla

Dans cet exemple, la propriété brand est marquée comme readonly. Toute tentative de modification entraînera une erreur de compilation.

Objets imbriqués dans TypeScript

Les objets TypeScript peuvent être imbriqués, ce qui signifie qu'un objet peut contenir un autre objet en tant que propriété. Cela est courant dans les structures de données complexes.

Exemple d'objets imbriqués

Voici un exemple d’objet imbriqué:

interface Address {
  street: string;
  city: string;
  zipCode: string;
}

interface User {
  name: string;
  age: number;
  address: Address; // Nested object
}

const user: User = {
  name: "Emily",
  age: 27,
  address: {
    street: "123 Main St",
    city: "New York",
    zipCode: "10001"
  }
};

console.log(user.address.city); // Output: New York

Dans cet exemple, l'interface User possède un objet Address imbriqué. L'objet user suit cette structure, permettant l'accès aux propriétés imbriquées.

Conclusion

Les objets TypeScript sont plus puissants et plus flexibles que les objets JavaScript simples en raison des définitions de type, des propriétés facultatives, des propriétés en lecture seule et des structures imbriquées. En définissant des objets à l'aide d'interfaces, vous pouvez créer du code plus robuste et sans erreur. Commencez à utiliser des objets TypeScript dans vos projets pour exploiter toute la puissance de la sécurité des types et des données structurées.