// @ts-check dans JS ; JSDoc pour obtenir les types
Activez la vérification des types dans les fichiers .js avec // @ts-check et JSDoc ; ajoutez @param/@returns, @type/@typedef et @template pour les motifs génériques ; configurez tsconfig pour une migration progressive.
// @ts-check dans JS ; JSDoc pour obtenir les types est une leçon TypeScript Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 1. 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 1 leçons au total.
Introduction
Objectif : profiter des avantages de TypeScript dans les fichiers .js. Vous activerez // @ts-check, ajouterez des types JSDoc et configurerez tsconfig pour une adoption progressive.
- Vérification fichier par fichier ou à l’échelle du projet
- @param, @returns, @type, @typedef
- @template pour les utilitaires de type générique
Activer la vérification
Ajoutez // @ts-check en haut d’un fichier .js. Utilisez @param/@returns pour documenter et typer la fonction.
// calculator.js
// @ts-check
/**
* Adds two numbers.
* @param {number} a
* @param {number} b
* @returns {number}
*/
export function add(a, b) {
return a + b
}
// Usage: type errors appear if you pass non-numbers
// add("2", 3) // TS will flag this in JSTypedef et type
Utilisez @typedef pour définir une structure réutilisable et @type pour annoter les variables. Les champs facultatifs sont marqués avec ?.
// models.js
// @ts-check
/** @typedef {{ id: string; name: string; age?: number }} User */
/** @type {User} */
export const currentUser = { id: "u1", name: "Ada" }
/**
* Greets a user.
* @param {User} u
* @returns {string}
*/
export function greet(u) {
return `Hello, ${u.name}!`
}Paramètres de modèle
@template introduit des paramètres de type pour les fonctions de type générique en JS. L’inférence fonctionne aux points d’appel.
// helpers.js
// @ts-check
/**
* Maps items with a function, preserving types.
* @template T,U
* @param {T[]} items
* @param {(x: T) => U} f
* @returns {U[]}
*/
export function map(items, f) {
const out = []
for (const x of items) out.push(f(x))
return out
}
// Inference: T=number, U=string
// map([1,2], n => n.toFixed(2))tsconfig pour JS
À l’échelle du projet : activez checkJs pour tous les fichiers .js. Définissez allowJs pour inclure les fichiers JS dans le programme. Utilisez noEmit lorsqu’un outil de regroupement gère la sortie.
// tsconfig.json
{
"compilerOptions": {
"target": "ES2020",
"module": "ESNext",
"checkJs": true,
"allowJs": true,
"strict": true,
"noEmit": true
},
"include": ["./**/*.js"],
"exclude": ["node_modules"]
}Conseils de migration
Conseils de migration :
- Commencez par les fichiers essentiels en utilisant
// @ts-check. - Créez de petits
@typedefpour les structures partagées. - Renommez progressivement les fichiers très sollicités en
.tsune fois les types stabilisés.
Vérification de ts-check
Vérification rapide : comment activez-vous la vérification TS dans un fichier .js ?
Récapitulatif
Récapitulatif : activez // @ts-check, ajoutez @param/@returns/@typedef/@template et renforcez tsconfig pour les projets JS avant de migrer vers .ts.
Questions Fréquemment Posées
La leçon « // @ts-check dans JS ; JSDoc pour obtenir les types » est-elle gratuite ?
Oui — le texte complet de « // @ts-check dans JS ; JSDoc pour obtenir les types » 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 1 leçons au total.
Qu'est-ce que j'apprendrai dans « // @ts-check dans JS ; JSDoc pour obtenir les types » ?
Activez la vérification des types dans les fichiers .js avec // @ts-check et JSDoc ; ajoutez @param/@returns, @type/@typedef et @template pour les motifs génériques ; configurez tsconfig pour une mig… 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 1.
Combien de temps prend la leçon « // @ts-check dans JS ; JSDoc pour obtenir les types » ?
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.