TypeScript Academy · Leçon

Opérateur d’assertion de non-nullité

Utiliser l’opérateur ! pour affirmer qu’une valeur n’est ni null ni undefined.

Opérateur d’assertion de non-nullité 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.

L'opérateur d'assertion de non-nullité

L'opérateur postfixe ! indique à TypeScript : « cette valeur n'est ni null ni undefined ici ». Il retire ces valeurs du type sans effectuer aucune vérification à l'exécution.

function firstChar(s: string | null): string {
  return s!.charAt(0); // assert s is not null
}
console.log(firstChar('hello'));

Où placer le !

Placez ! immédiatement après l'expression dont vous affirmez le type, avant tout autre accès. Il retire null | undefined du type de cette expression.

type Box = { value?: number };
const box: Box = { value: 7 };
const n: number = box.value!; // value is number | undefined -> number
console.log(n);

Affirmer la non-nullité après une garde

Vous avez parfois établi logiquement qu'une valeur est présente, mais le compilateur ne peut pas suivre votre raisonnement. ! vous permet alors de continuer. Malgré tout, une véritable vérification à l'exécution est généralement plus claire.

const list: Array<string | null> = ['a', null, 'c'];
const present = list.filter((x) => x !== null);
// TS may still see string | null; assert if certain:
console.log(present[0]!.toUpperCase());

Toujours uniquement à la compilation

Comme as, l'opérateur ! est supprimé lors de l'exécution. Il n'effectue aucune vérification. Si la valeur est réellement nulle, vous obtiendrez une erreur à l'exécution même si le compilateur est satisfait.

function risky(s: string | null): number {
  return s!.length; // no runtime guard
}
console.log(risky('hi'));
// risky(null) would throw at runtime

Le danger de !

Si vous affirmez la non-nullité d'une valeur qui peut réellement être nulle, vous créez un bogue caché. Le compilateur cesse de vous avertir et l'erreur n'apparaît que lorsque cette valeur nulle survient en production.

type User = { name?: string };
const u: User = {};
// const len = u.name!.length; // compiles, crashes at runtime
console.log('name is undefined here -> ! would crash');

Préférer une véritable vérification

Chaque fois que c'est possible, remplacez ! par une véritable vérification de nullité ou par le chaînage optionnel. La version sûre ne coûte qu'une ligne et élimine toute une catégorie de plantages à l'exécution.

type User = { name?: string };
function nameLen(u: User): number {
  if (u.name) return u.name.length; // checked
  return 0;
}
console.log(nameLen({ name: 'Ada' }), nameLen({}));

Assertion d'assignation définitive

Une fonctionnalité associée est l'assertion d'assignation définitive : let x!: T. Elle promet au compilateur que x recevra une valeur avant d'être utilisé, même s'il n'est pas initialisé lors de sa déclaration.

let token!: string; // promise: assigned before use
function init() { token = 'abc123'; }
init();
console.log(token.length);

Assignation définitive dans les classes

Cette fonctionnalité est courante dans les classes lorsqu'une propriété est définie par un framework ou une méthode d'initialisation plutôt que par le constructeur. Le ! placé après le nom de la propriété fait taire l'erreur indiquant qu'elle n'est pas définitivement assignée.

class Service {
  config!: { url: string }; // set later by setup()
  setup() { this.config = { url: '/api' }; }
}
const s = new Service();
s.setup();
console.log(s.config.url);

Utiliser l'assignation définitive avec prudence

L'assertion d'assignation définitive est une autre promesse que le compilateur ne peut pas vérifier. Si vous accédez à la propriété avant de lui attribuer une valeur, vous lirez undefined à l'exécution, sans aucun avertissement.

class Late {
  data!: number[];
  read() { return this.data.length; } // crashes if called before init
}
const l = new Late();
l.data = [1, 2];
console.log(l.read());

! ou chaînage optionnel

Ne choisissez pas ! lorsque ?. suffirait. Le chaînage optionnel gère les valeurs nulles en toute sécurité à l'exécution, tandis que ! se contente de faire taire le compilateur. Ces opérateurs répondent à des problèmes différents.

type Cfg = { db?: { host?: string } };
const c: Cfg = {};
console.log(c.db?.host ?? 'localhost'); // safe
// c.db!.host! would crash here

Quand ! est justifié

L'opérateur ! est raisonnable lorsque vous disposez d'une véritable garantie que le compilateur ne peut pas exprimer — par exemple, une valeur que vous venez d'ajouter et que vous lisez immédiatement. Même dans ce cas, documentez la raison pour laquelle son utilisation est sûre.

const cache = new Map<string, number>();
cache.set('hits', 0);
// We just set it, so get is non-null:
const hits = cache.get('hits')!;
console.log(hits);

Vérification rapide

Vérifiez votre compréhension de l'opérateur d'assertion de non-nullité.

Récapitulatif : assertion de non-nullité

Vous avez appris que :

L’opérateur postfixe ! supprime null | undefined d’un type uniquement à la compilation.
Il n’effectue aucune vérification à l’exécution, donc une assertion incorrecte provoque quand même un plantage.
let x!: T est l’assertion d’affectation définitive pour les valeurs initialisées ultérieurement.
Privilégiez les vérifications réelles ou le chaînage optionnel ; réservez ! aux garanties avérées.

Ensuite, les doubles assertions et leurs risques.

const map = new Map<string, number>();
map.set('a', 1);
const v = map.get('a')!;
console.log(v);

Questions Fréquemment Posées

La leçon « Opérateur d’assertion de non-nullité » est-elle gratuite ?

Oui — le texte complet de « Opérateur d’assertion de non-nullité » 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 « Opérateur d’assertion de non-nullité » ?

Utiliser l’opérateur ! pour affirmer qu’une valeur n’est ni null ni undefined. 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 « Opérateur d’assertion de non-nullité » ?

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

Le mot-clé as pour les assertions de type
Opérateur d’assertion de non-nullité
Assertions doubles et leurs risques
Assertions et gardes de type

← Retour à TypeScript Academy