Réponse.

L'opérateur d'assertion Non-Null (!) est une syntaxe spéciale de TypeScript qui permet de dire explicitement au compilateur : "Je sais que la variable à ce moment n'est ni null ni undefined". Cet opérateur a été ajouté pour résoudre les problèmes de typage dans les scénarios où le programmeur est sûr de l'existence d'une valeur, mais TypeScript ne peut pas le garantir en raison de son analyse stricte.

Historique de la question

TypeScript prend très au sérieux la possibilité que les variables soient null ou undefined, en particulier lorsque l'option strictNullChecks est activée. Pour se débarrasser des avertissements du compilateur dans les situations où le programmeur est sûr de la sécurité de la valeur, l'assertion non-null a été introduite.

Problème

TypeScript ne peut pas toujours suivre tous les chemins de code et comprendre qu'il n'est pas nécessaire d'effectuer une vérification pour null. Cela se produit souvent après du code asynchrone, dans des callbacks, lors de la manipulation d'éléments DOM.

Solution

L'opérateur d'assertion Non-Null (!) informe le compilateur qu'il n'y a pas de null/undefined à cet endroit, supprimant ainsi l'erreur de typage.

Exemple de code :

function processUser(user?: {name: string}) {
  // TS générera une erreur sans l'opérateur : user peut être undefined
  console.log(user!.name); // L'opérateur ! promet que user est défini
}

Caractéristiques clés :

Ne supprime l'erreur qu'au moment de la compilation, n'affecte pas la logique d'exécution.
Utilisé exclusivement là où la non-nullité de la valeur est garantie.
Une utilisation excessive ou inconsciente peut entraîner des erreurs d'exécution.

Questions pièges.

Peut-on utiliser ! pour n'importe quelle valeur de n'importe quel type ? Par exemple : let x: number = y!

L'opérateur ! a du sens uniquement pour les types qui peuvent potentiellement contenir null/undefined selon le compilateur. Pour des variables fortement typées sans nullabilité, cela n'a pas d'effet.

Remplace-t-il complètement la vérification de null/undefined ? Est-il nécessaire de faire une vérification d'exécution ?

Non, l'opérateur ! n'effectue pas de vérifications au moment de l'exécution. Il aide uniquement le compilateur et si la valeur réelle s'avère être undefined/null, une erreur d'exécution se produira.

function foo(data?: string) {
  // peut conduire à une erreur
  alert(data!.length);
}

L'opérateur ! peut-il éviter des erreurs dans le code asynchrone, si la variable d'origine change dans un autre thread ?

Non. L'opérateur ! fonctionne uniquement au point d'utilisation. Si entre la vérification et l'utilisation, la valeur devient undefined, on ne peut pas éviter l'erreur. On doit toujours s'assurer de l'actualité de la non-nullité.

Erreurs typiques et anti-patterns

Utilisation de ! pour "suppress" une erreur quand on n'est pas sûr de la présence d'une valeur.
Application généralisée sans réelle compréhension du contexte.
Application de ! dans des endroits où le type est requis ou où une vérification d'exécution est assurée.

Exemple de la vie réelle

Cas négatif

Dans un composant React, on accède au DOM via ref avec l'opérateur ! sans vérification préalable :

const ref = useRef<HTMLDivElement>(null);
ref.current!.focus(); // si ref.current est null, il y aura une erreur d'exécution

Avantages :

Supprime l'erreur de compilation.

Inconvénients :

Peut provoquer une erreur critique d'exécution en tentant d'accéder à un élément inexistant.

Cas positif

Utilisation d'une vérification d'existence avant l'application :

if (ref.current) {
  ref.current.focus();
}