satisfies ou annotation de type
Conserver l’inférence des littéraux tout en validant la structure.
satisfies ou annotation de type est une leçon TypeScript Academy gratuite sur CoddyKit. Ceci est la leçon 2 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.
Le modèle avec annotation
Le modèle classique const config: Type = {...} valide l’objet, mais le type de la variable devient Type, ce qui élargit tous les littéraux qu’elle contient.
type Config = { mode: string; level: number };
const config: Config = { mode: "dark", level: 5 };
// config.mode has type string
console.log(config.mode);À quoi ressemble l’élargissement
Avec l’annotation, config.mode est de type string. Vous ne pouvez pas l’affecter à une variable qui attend le littéral "dark".
type Config = { mode: string };
const config: Config = { mode: "dark" };
// const m: "dark" = config.mode; // Error: string not assignable to "dark"
console.log(config.mode);Le modèle avec satisfies
Avec const config = {...} satisfies Type, la variable conserve son type inféré exact tout en étant vérifiée par rapport à Type.
type Config = { mode: string; level: number };
const config = { mode: "dark", level: 5 } satisfies Config;
// config.mode has type "dark"
console.log(config.mode);L’inférence exacte est préservée
Désormais, config.mode est le littéral "dark", et fonctionne donc partout où le type restreint est requis.
type Config = { mode: string };
const config = { mode: "dark" } satisfies Config;
const m: "dark" = config.mode; // OK
console.log(m);Les deux approches valident toujours
Les deux modèles rejettent les objets incorrects. La différence concerne uniquement le type de variable obtenu, et non le fait qu’une validation ait lieu.
type Config = { level: number };
// const a: Config = { level: "x" }; // Error
// const b = { level: "x" } satisfies Config; // Error
const ok = { level: 3 } satisfies Config;
console.log(ok.level);Les propriétés supplémentaires sont détectées
Comme les annotations, satisfies signale les propriétés en trop qui ne figurent pas dans le type cible, ce qui aide à détecter les fautes de frappe dans les clés.
type Config = { mode: string };
// const c = { mode: "dark", extar: true } satisfies Config; // Error: extar
const c = { mode: "dark" } satisfies Config;
console.log(c.mode);Préserver le caractère de tuple
satisfies aide également les tableaux à conserver une précision semblable à celle des tuples lorsqu’il est associé à as const, tout en validant les types des éléments.
type Nums = readonly number[];
const xs = [1, 2, 3] as const satisfies Nums;
// xs is a readonly tuple [1, 2, 3], validated as numbers
console.log(xs.length);L’annotation élargit les membres d’une union
Si un champ est une union comme "a" | "b", une annotation utilisant cette union le conserve sous forme d’union, tandis qu’un type de champ plus large l’élargit. satisfies fixe le membre exact.
type Config = { tier: string };
const withAnn: Config = { tier: "pro" }; // tier: string
const withSat = { tier: "pro" } satisfies Config; // tier: "pro"
console.log(withAnn.tier, withSat.tier);Conserver l’autocomplétion lors des lectures
Comme satisfies préserve les clés et les valeurs littérales, les éditeurs peuvent proposer une autocomplétion fondée sur l’objet exact, et non sur le type déclaré plus large.
type Theme = Record<string, string>;
const theme = { bg: "black", fg: "white" } satisfies Theme;
// theme.<autocomplete shows bg and fg>
console.log(theme.bg, theme.fg);Choisir entre les deux approches
Utilisez une annotation simple lorsque vous souhaitez réellement le type plus large. Utilisez satisfies lorsque vous voulez une validation tout en ayant besoin de la structure inférée précise par la suite.
type Config = { mode: string };
// Want wide type for reassignment flexibility -> annotation
let a: Config = { mode: "dark" };
// Want exact literals for later indexing -> satisfies
const b = { mode: "dark" } satisfies Config;
console.log(a.mode, b.mode);Résumé côte à côte
L’annotation élargit ; satisfies préserve. Les deux valident. Pour les configurations immuables que vous consultez, satisfies constitue généralement le meilleur choix par défaut.
type C = { color: string; size: number };
const widened: C = { color: "red", size: 1 };
const exact = { color: "red", size: 1 } satisfies C;
console.log(widened.color, exact.color);Vérification rapide : satisfies contre l’annotation
Vérifiez votre compréhension de la différence.
Récapitulatif : satisfies contre l’annotation de type
Une annotation de type valide, mais élargit les littéraux vers leurs types de base. L’opérateur satisfies valide et conserve l’inférence exacte, y compris les valeurs littérales, les clés et la précision des tuples.
type C = { mode: string };
const c = { mode: "dark" } satisfies C;
const exact: "dark" = c.mode;
console.log(exact);Questions Fréquemment Posées
La leçon « satisfies ou annotation de type » est-elle gratuite ?
Oui — le texte complet de « satisfies ou annotation de type » 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 « satisfies ou annotation de type » ?
Conserver l’inférence des littéraux tout en validant la structure. 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 2 sur 4.
Combien de temps prend la leçon « satisfies ou annotation de type » ?
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
- Pourquoi satisfies existe
- satisfies ou annotation de type
- satisfies ou assertion as
- Modèles pratiques avec satisfies