Interfaces et Types Personnalisés en Typescript

Après avoir exploré les types de base en Typescript, il est temps de monter d'un cran et d'apprendre à structurer vos données avec des interfaces et des types personnalisés.

Ces concepts vous permettront de créer des applications plus robustes et maintenables.

Interfaces : Structurer vos Objets

Les interfaces en Typescript sont un moyen puissant de définir la structure des objets. Elles permettent de s'assurer que les objets respectent un certain contrat, ce qui rend notre code plus prévisible et moins sujet aux erreurs.

Définir une Interface

Imaginons que nous construisions une application pour gérer une liste de tâches. Voici une interface qui pourrait représenter une tâche :

interface Task {
  title: string
  description: string
  completed: boolean
}

Avec cette interface, on peut maintenant créer des objets Task en étant sûr qu'ils respectent la structure que nous avons définie :

let task1: Task = {
  title: 'Apprendre Typescript',
  description:
    'Se familiariser avec les interfaces et les types personnalisés.',
  completed: false,
}

Propriétés Optionnelles

Parfois, toutes les propriétés d'une interface ne sont pas nécessaires. On peut définir des propriétés optionnelles en utilisant le point d'interrogation (?) :

interface Task {
  title: string
  description?: string
  completed: boolean
}

let task2: Task = {
  title: 'Lire un article sur Typescript',
  completed: true,
}

Lecture Seule

Pour les propriétés dont nous ne voulons pas modifier après leur initialisation, nous pouvons utiliser le mot-clé readonly :

interface Task {
  readonly id: number
  title: string
  description?: string
  completed: boolean
}

let task3: Task = {
  id: 1,
  title: 'Configurer un projet Typescript',
  completed: false,
}

// task3.id = 2; // Erreur : id est en lecture seule

Types Personnalisés : Flexibilité et Clarté

En plus des interfaces, Typescript nous permet de définir des types personnalisés avec le mot-clé type.

Ces types personnalisés nous offrent une grande flexibilité, notamment pour créer des unions et des intersections de types.

Types Alias

Un type alias nous permet de donner un nom à un type de données complexe. Utiliser des alias est souvent plus flexible et léger que d'utiliser des enums, surtout lorsque nous avons des valeurs constantes simples à définir :

type TaskStatus = 'not-started' | 'in-progress' | 'completed'

interface Task {
  title: string
  status: TaskStatus
}

let task4: Task = {
  title: 'Écrire un article sur Typescript',
  status: 'in-progress',
}

Voici quelques avantages des Types Alias par rapport aux Enums

1. Performance : Les types alias sont évalués au moment de la compilation, ce qui signifie qu'ils n'ont aucun impact sur le runtime. Les enums, par contre, sont des objets JavaScript qui existent au runtime et peuvent avoir un impact sur la performance.
2. Flexibilité : Les types alias permettent d'utiliser des unions de types de manière très flexible, tandis que les enums sont limités à des valeurs discrètes définies.
3. Interopérabilité : Les types alias peuvent être plus facilement utilisés avec d'autres types et structures de Typescript, ce qui permet une meilleure interopérabilité dans le code.

Unions et Intersections

Les types personnalisés brillent vraiment lorsqu'il s'agit de créer des unions et des intersections de types.

Unions

Une union permet à une variable de tenir plusieurs types possibles :

type Result = string | number

let result1: Result = 'Succès'
let result2: Result = 200

Intersections

Une intersection combine plusieurs types en un seul :

interface User {
  name: string
  email: string
}

interface Admin {
  isAdmin: boolean
}

type AdminUser = User & Admin

let admin: AdminUser = {
  name: 'Alice',
  email: 'alice@example.com',
  isAdmin: true,
}

Utilisation des Interfaces avec les Classes

Les interfaces sont particulièrement utiles lorsqu'elles sont utilisées avec des classes pour garantir qu'une classe implémente certaines propriétés et méthodes :

interface Logger {
  log(message: string): void
}

class ConsoleLogger implements Logger {
  log(message: string): void {
    console.log(message)
  }
}

Conclusion

Les interfaces et les types personnalisés sont des outils essentiels en Typescript pour structurer et typer vos données de manière précise et flexible.

Ils nous permettent de créer un code plus lisible et maintenable tout en réduisant les erreurs.