TypeScript Academy · Leçon

TypeScript 5.3-5.4 : nouvel affinement et NoInfer

Appliquez l’utilitaire NoInfer et le nouvel affinement de switch/case

Leçon 3 sur 413 étapes

TypeScript 5.3-5.4 : nouvel affinement et NoInfer est une leçon TypeScript Academy gratuite sur CoddyKit. Ceci est la leçon 3 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.

Présentation de TypeScript 5.3

TypeScript 5.3 (novembre 2023) a apporté une amélioration du rétrécissement dans les instructions switch/case, la prise en charge des types importés dans JSDoc et le mode de résolution dans import type.

// npm install typescript@5.3

Amélioration du rétrécissement dans switch/case

TS 5.3 a amélioré le rétrécissement des types dans les instructions switch, en particulier pour les unions discriminées comportant plusieurs cas.

type Result = { status: "ok"; data: string } | { status: "err"; code: number };

function handle(r: Result) {
  switch (r.status) {
    case "ok":
      console.log(r.data);   // r: { status: "ok"; data: string } — narrowed
      break;
    case "err":
      console.log(r.code);   // r: { status: "err"; code: number } — narrowed
      break;
  }
}

Importation de type dans JSDoc

TS 5.3 a ajouté la prise en charge de la balise JSDoc @import pour les importations réservées aux types dans les fichiers JavaScript.

/** @import { User } from "./types.js" */

/** @param {User} user */
function greet(user) {
  console.log(user.name);
}

Mode de résolution dans l’importation de type

TS 5.3 permet de spécifier resolution-mode dans import type afin de contrôler si l’importation est résolue comme CommonJS ou ESM.

import type { User } from "some-library" with { "resolution-mode": "require" };

Présentation de TypeScript 5.4

TypeScript 5.4 (mars 2024) a introduit le type utilitaire NoInfer, conservé le rétrécissement dans les fermetures et ajouté les types de Object.groupBy et Map.groupBy.

// npm install typescript@5.4

Type utilitaire NoInfer<T>

NoInfer empêche TypeScript d’utiliser un argument générique comme site d’inférence, ce qui force l’inférence du type à partir des autres arguments uniquement.

function createStore<T>(initial: T, onChange: (val: NoInfer<T>) => void) {
  // T inferred from initial, not from onChange callback
}

createStore({ count: 0 }, (val) => {
  // val: { count: number } — inferred from initial only
});

Pourquoi NoInfer est important

Sans NoInfer, TypeScript tenterait d’inférer T à partir des deux arguments et pourrait élargir le type de manière inattendue.

// Before NoInfer: T may be widened by the callback
function createStore<T>(initial: T, onChange: (val: T) => void) {}
createStore({ count: 0 }, (val: { count: number; extra: string }) => {});
// T widened to include extra — not what we want

Rétrécissement conservé après les fermetures

TS 5.4 conserve le rétrécissement des types dans les fermetures lorsque la variable rétrécie n’est plus affectée après la fermeture.

function process(val: string | null) {
  if (!val) return;
  // val: string
  setTimeout(() => {
    console.log(val.toUpperCase()); // TS 5.4: still string — not widened
  }, 100);
}

Typage de Object.groupBy

TS 5.4 a ajouté les types des méthodes statiques Object.groupBy et Map.groupBy d’ES2024.

const users = [
  { name: "Alice", role: "admin" },
  { name: "Bob", role: "user" },
];
const grouped = Object.groupBy(users, (u) => u.role);
// grouped: { [role: string]: { name: string; role: string }[] }

Génération améliorée des déclarations

TS 5.4 a amélioré la génération des fichiers de déclaration dans les cas complexes impliquant des types mappés et conditionnels, réduisant les erreurs fausses dans les fichiers .d.ts générés.

// Fewer "Type ... is not assignable to type ..." errors
// in generated declaration files from TS 5.4 onward

Récapitulatif : TS 5.3-5.4

TS 5.3 : rétrécissement amélioré dans switch/case et prise en charge de @import dans JSDoc. TS 5.4 : NoInfer pour bloquer les sites d’inférence indésirables, rétrécissement conservé dans les fermetures et types de Object.groupBy.

Vérification rapide

Qu’empêche NoInfer ?

Ce que vous avez appris

TS 5.3 a amélioré le rétrécissement dans switch/case et ajouté les types d’importation dans JSDoc. TS 5.4 a introduit NoInfer pour contrôler les sites d’inférence, conservé le rétrécissement dans les fermetures et ajouté les types de Object.groupBy pour ES2024.

Gratuit pour commencer

Apprends TypeScript avec un tuteur IA — gratuit

Écris et exécute du vrai code dans ton navigateur, obtiens de l'aide instantanée d'un tuteur IA disponible 24h/24, et reprends là où tu t'es arrêté sur le web ou dans l'app.

Cours
101
Leçons
352

Questions Fréquemment Posées

La leçon « TypeScript 5.3-5.4 : nouvel affinement et NoInfer » est-elle gratuite ?

Oui — le texte complet de « TypeScript 5.3-5.4 : nouvel affinement et NoInfer » 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 « TypeScript 5.3-5.4 : nouvel affinement et NoInfer » ?

Appliquez l’utilitaire NoInfer et le nouvel affinement de switch/case 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 3 sur 4.

Combien de temps prend la leçon « TypeScript 5.3-5.4 : nouvel affinement et NoInfer » ?

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. TypeScript 5.0 : décorateurs standard et paramètres de types const
  2. TypeScript 5.1-5.2 : déduction améliorée
  3. TypeScript 5.3-5.4 : nouvel affinement et NoInfer
  4. TypeScript 5.5+ : déclarations isolées et nouveautés
← Retour à TypeScript Academy