0Pricing
TypeScript Academy · Leçon

Définir des signatures d’index

Décrire des objets dont les clés ne sont pas connues à l’avance.

Définir des signatures d’index est une leçon TypeScript Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage TypeScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours TypeScript Academy comprend 4 leçons au total.

Objets avec des clés inconnues

Parfois, vous ne connaissez pas à l’avance les noms des propriétés — un dictionnaire de scores, un cache ou une table de recherche. La signature d’index de TypeScript vous permet de décrire un objet dont les clés sont arbitraires, mais dont les valeurs partagent un même type.

Syntaxe de base d’une signature d’index

Une signature d’index s’écrit { [key: string]: number }. Elle signifie que toute clé de type chaîne correspond à une valeur numérique. Le nom key est simplement un libellé : vous pouvez lui donner n’importe quel nom.

type Scores = { [name: string]: number }

const game: Scores = { alice: 10, bob: 7 }
console.log(game.alice) // 10

Ajouter des clés dynamiquement

Comme toute clé de type chaîne est autorisée, vous pouvez attribuer de nouvelles propriétés à l’exécution sans que TypeScript ne se plaigne. C’est précisément le rôle d’une signature d’index.

type Scores = { [name: string]: number }

const game: Scores = {}
game.charlie = 5     // allowed
game["dave"] = 9     // also allowed
console.log(game.charlie + game.dave) // 14

Accéder à des clés arbitraires

Vous pouvez lire n’importe quelle clé, même une clé qui n’a jamais été définie. Le système de types fait confiance à la signature, donc le type de la valeur est number — mais à l’exécution, une clé absente vaut undefined. Soyez prudent.

type Scores = { [name: string]: number }

const game: Scores = { alice: 10 }
const missing = game.zara // typed as number, but actually undefined
console.log(missing) // undefined

Toutes les valeurs doivent respecter le type

Chaque propriété de l’objet doit correspondre au type de valeur indiqué par la signature. Vous ne pouvez pas mélanger une valeur numérique dans un dictionnaire dont les valeurs sont des chaînes.

type Labels = { [key: string]: string }

const ok: Labels = { id: "a1", role: "admin" }
// const bad: Labels = { id: "a1", count: 5 } // Error: 5 not a string

Signatures d’index dans les interfaces

La même syntaxe fonctionne à l’intérieur d’une interface. Elle est couramment utilisée pour décrire des ensembles de paramètres de configuration ou des tables de réponses provenant d’une API.

interface Dictionary {
  [word: string]: string
}

const defs: Dictionary = {
  cat: "a small animal",
  ts: "a typed superset of JavaScript",
}
console.log(defs.ts)

Les types de valeurs peuvent être quelconques

Le type des valeurs n’est pas limité aux types primitifs. Vous pouvez associer les clés à des tableaux, des objets ou des unions — selon les besoins de vos données.

type Groups = { [team: string]: string[] }

const roster: Groups = {
  red: ["ana", "leo"],
  blue: ["sam"],
}
console.log(roster.red.length) // 2

Parcourir des objets avec signature d’index

Une boucle for...in parcourt chaque clé dynamique. À l’intérieur de la boucle, la valeur est correctement typée conformément à la signature.

type Scores = { [name: string]: number }
const game: Scores = { alice: 10, bob: 7 }

for (const name in game) {
  console.log(name + ": " + game[name])
}

La faille de sécurité liée à undefined

Les signatures d’index masquent le fait que les recherches peuvent échouer. Activer noUncheckedIndexedAccess dans tsconfig ajoute | undefined à chaque accès, ce qui vous oblige à gérer les clés absentes.

// with noUncheckedIndexedAccess on:
type Scores = { [name: string]: number }
const game: Scores = { alice: 10 }
const v = game.bob // type: number | undefined
console.log(v ?? 0)

Signatures d’index en lecture seule

Préfixez la signature par readonly pour interdire toute écriture au moyen d’une clé. Le dictionnaire devient une structure permettant uniquement les recherches.

type Frozen = { readonly [key: string]: number }

const rates: Frozen = { usd: 1, eur: 1.1 }
// rates.usd = 2 // Error: read-only
console.log(rates.eur)

Quand les signatures d’index sont particulièrement utiles

Utilisez une signature d’index lorsque l’ensemble des clés est ouvert et découvert à l’exécution : caches, compteurs indexés par un identifiant ou paramètres de requête analysés. Pour un ensemble fixe de clés connues, préférez des propriétés explicites ou Record.

type Counter = { [event: string]: number }
const clicks: Counter = {}
function track(e: string) { clicks[e] = (clicks[e] ?? 0) + 1 }
track("open"); track("open")
console.log(clicks.open) // 2

Vérification rapide

Évaluez votre compréhension des signatures d’index.

Récapitulatif

Vous avez appris que { [key: string]: T } décrit des objets avec des clés arbitraires dont les valeurs partagent toutes le type T. Les clés peuvent être ajoutées dynamiquement, chaque valeur doit respecter la signature et la recherche d’une clé absente donne undefined à l’exécution. Utilisez readonly pour les tables immuables et activez noUncheckedIndexedAccess pour des accès plus sûrs.

Questions Fréquemment Posées

La leçon « Définir des signatures d’index » est-elle gratuite ?

Oui — le texte complet de « Définir des signatures d’index » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours TypeScript Academy, passe à CoddyKit PRO. Le cours TypeScript Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « Définir des signatures d’index » ?

Décrire des objets dont les clés ne sont pas connues à l’avance. Tu pratiques TypeScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer TypeScript Academy ?

Aucune expérience préalable n'est requise. TypeScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 4.

Combien de temps prend la leçon « Définir des signatures d’index » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon TypeScript Academy ?

Oui. Chaque leçon TypeScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

  1. Définir des signatures d’index
  2. Signatures d’index de chaînes et de nombres
  3. Combiner clés connues et dynamiques
  4. Signatures d’index ou Record
← Retour à TypeScript Academy