Mode strict et suppression de any
Activez tous les indicateurs stricts dans tsconfig, utilisez unknown à la place de any, appliquez les assertions de type de manière sûre et migrez un fichier faiblement typé vers le mode strict.
Mode strict et suppression de any est une leçon Frontend Academy gratuite sur CoddyKit. Ceci est la leçon 4 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 Frontend Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Frontend Academy comprend 4 leçons au total.
Pourquoi le mode strict ?
strict: true dans tsconfig.json active tous les indicateurs de sécurité de TypeScript : c’est le niveau d’exigence des projets sérieux. Il détecte à la compilation les problèmes liés à null, les paramètres non typés et les affectations dangereuses.
Ce que strict active
strict est un indicateur global qui active : noImplicitAny, strictNullChecks, strictFunctionTypes, strictBindCallApply, strictPropertyInitialization, alwaysStrict, noImplicitThis et useUnknownInCatchVariables.
strictNullChecks
Sans cette option, null et undefined peuvent être affectés à n’importe quel type : c’est une source constante de bogues. Avec elle, vous devez gérer explicitement les cas null.
// Without strictNullChecks — runtime error:
function greet(name: string) { return name.toUpperCase(); }
greet(null); // compiler allows, crashes at runtime
// With strictNullChecks:
function greet(name: string | null) {
if (name == null) return '';
return name.toUpperCase();
}noImplicitAny
Sans cet indicateur, les paramètres dépourvus d’annotation de type prennent par défaut le type any, ce qui contourne silencieusement le système de types. Avec noImplicitAny, vous devez les annoter.
// Without noImplicitAny:
function format(value) { return value.toUpperCase(); } // value: any
// With:
function format(value: string) { return value.toUpperCase(); }strictPropertyInitialization
Les propriétés de classe sans initialiseur garanti deviennent potentiellement undefined. Initialisez-les ou utilisez l’opérateur d’affectation définitive !.
class User {
name!: string; // tell TS: I'll set this elsewhere
age = 0; // default initialiser
email: string; // ERROR with strictPropertyInitialization
constructor(email: string) { this.email = email; } // FIX: init in ctor
}Utiliser unknown plutôt que any
any désactive la vérification des types. unknown est sûr du point de vue du typage : vous devez affiner le type avant de l’utiliser. Préférez toujours unknown.
// any — no checks, bug magnet:
function parse(input: any) {
return input.toUpperCase(); // compiler is fine, runtime may crash
}
// unknown — must narrow:
function parse(input: unknown) {
if (typeof input === 'string') {
return input.toUpperCase();
}
throw new Error('Expected string');
}Assertions de type sûres
Si vous devez effectuer une assertion (parce que vous en savez plus que TS), préférez la syntaxe as. N’effectuez pas de double assertion (x as unknown as T), sauf si vous n’avez réellement pas d’autre choix : c’est un signe de mauvaise conception.
const el = document.getElementById('app') as HTMLDivElement;
el.style.background = 'blue';
// Safer alternative: runtime check
const el = document.getElementById('app');
if (!(el instanceof HTMLDivElement)) throw new Error('app missing');
el.style.background = 'blue'; // narrowed to HTMLDivElementÉliminer any d’un projet
Stratégie : activez le mode strict, puis corrigez les erreurs produites, un fichier à la fois. Utilisez unknown et affinez son type. Ajoutez @ts-expect-error accompagné d’un commentaire TODO pour les emplacements connus comme incorrects, afin qu’ils ne puissent pas être ignorés.
Règle de lint : no-explicit-any
Ajoutez @typescript-eslint/no-explicit-any à votre configuration ESLint pour empêcher l’ajout de nouveaux any.
// .eslintrc.json
{
"rules": {
"@typescript-eslint/no-explicit-any": "error"
}
}strictFunctionTypes
Cette option impose la vérification contravariante des paramètres de fonction : elle empêche d’affecter des fonctions dont les types de paramètres sont plus larges que prévu, ce qui provoquerait un plantage à l’exécution.
Type de la variable d’exception
useUnknownInCatchVariables fait inférer e: unknown à catch (e), au lieu de any. Vous devez affiner le type avant d’accéder à ses propriétés.
try {
doRisky();
} catch (e) {
// e is unknown
if (e instanceof Error) {
console.error(e.message);
} else {
console.error('Unknown error', e);
}
}Conseils de migration
Activez strict dans les nouveaux projets dès le premier jour. Pour le code existant, activez les indicateurs progressivement. Commencez par strictNullChecks (le gain le plus important), puis noImplicitAny. Utilisez //@ts-expect-error plutôt que //@ts-ignore afin que le commentaire puisse être supprimé lorsque le problème est corrigé.
Vérification rapide
Pourquoi unknown est-il plus sûr que any lorsque vous ne connaissez pas le type d’une valeur ?
Récapitulatif : mode strict
Activez strict: true pour une sécurité complète. strictNullChecks impose la gestion de null. noImplicitAny exige l’annotation des paramètres. Utilisez strictPropertyInitialization pour les champs de classe. Préférez unknown à any : affinez le type avec des gardes de type. Évitez les doubles assertions. Effectuez une vérification avec no-explicit-any. Faites migrer le code existant un fichier à la fois à l’aide de marqueurs @ts-expect-error.
Questions Fréquemment Posées
La leçon « Mode strict et suppression de any » est-elle gratuite ?
Oui — le texte complet de « Mode strict et suppression de any » 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 Frontend Academy, passe à CoddyKit PRO. Le cours Frontend Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « Mode strict et suppression de any » ?
Activez tous les indicateurs stricts dans tsconfig, utilisez unknown à la place de any, appliquez les assertions de type de manière sûre et migrez un fichier faiblement typé vers le mode strict. Tu pratiques Frontend 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 Frontend Academy ?
Aucune expérience préalable n'est requise. Frontend 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 4 sur 4.
Combien de temps prend la leçon « Mode strict et suppression de any » ?
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 Frontend Academy ?
Oui. Chaque leçon Frontend 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
- Types de littéraux de modèles
- Décorateurs et métadonnées
- TypeScript avec React : génériques, FC et hooks
- Mode strict et suppression de any