Généraux en TypeScript

Introduction aux Généraux

Dans TypeScript, les généraux permettent d'attribuer plusieurs types à une fonction ou à une variable tout en conservant les informations de type spécifiques lors de leur retour. En revanche, l'utilisation du mot clé any autorise tous les types, mais ne conserve pas les informations de type exactes.

Syntaxe des Généraux

Les généraux se définissent avec des crochets < > qui entourent le nom(s) du type générique, comme Array ou Map.

Voici un exemple d'interface définissant un type générique :

interface MonType {
  valeur: ValeurGenerique;
}

let maVar: MonType = { valeur: 'Bonjour, le monde!' };

Utilisation des Généraux

Les types génériques peuvent être employés avec : - Classes, - Fonctions, - Interfaces, - Alias de type.

Exemple d'Utilisation des Généraux

Dans le code ci-dessous, Box est une interface générique avec un type générique de Valeur. Les variables numberBox et stringBox sont alors définies comme types Box et Box respectivement :

interface Box {  valeur: Valeur;}

let numberBox: Box = { valeur: 7 };
let stringBox: Box = { valeur: 'Marathon' };

Inférer des Types Généraux

Les types génériques peuvent également être inférés en fonction de leur utilisation, sans qu'il soit nécessaire de les spécifier explicitement. Ainsi, dans l'exemple suivant, logAndReturnValue sera d'abord inféré comme ayant un type générique de Date :

function logAndReturnValue(value: Valeur): Valeur {
  console.log(value);
  return value;
}

const result = logAndReturnValue(new Date('2021-12-21')); // Type: Date

Dans cet exemple, l'instance de la classe KeyValueStore est inférée avec des génériques, ce qui permet à sa méthode makePair() de retourner le type [string, number] :

class KeyValueStore {
  #key: Clef;
  #value: Valeur;

  constructor(key: Clef, value: Valeur) {
    this.#key = key;
    this.#value = value;
  }

  makePair(): [Clef, Valeur] {
    return [this.#key, this.#value];
  }
}

const magasin = new KeyValueStore('année', 2794);
const pair = magasin.makePair(); // Type: [string, number]