[Nouveau] Rejoignez la communauté Angular.fr !

Skip to content

Opérateur de chaînage optionnel

L'opérateur facultatif (?.), également appelé opérateur de chaînage optionnel, est une fonctionnalité de JavaScript qui permet de lire la valeur d'une propriété située en profondeur dans une chaîne d'objets sans avoir à valider expressément chaque référence intermédiaire. Cet opérateur est très utile pour éviter les erreurs de type TypeError lorsqu'on tente d'accéder à une propriété d'un objet qui peut ne pas exister.

Syntaxe

javascript
let valeur = objet?.propriete;

Dans cet exemple, si objet existe (c'est-à-dire qu'il n'est ni null ni undefined), alors objet.propriete sera retourné. Si objet est null ou undefined, alors l'expression retournera undefined, sans générer d'erreur.

Exemple d'Utilisation

Imaginons que vous ayez un objet personne qui peut contenir un objet adresse, qui lui-même contient une propriété rue. Pour accéder à rue en toute sécurité, vous pouvez utiliser l'opérateur facultatif.

javascript
let personne = {
    nom: "Alice",
    adresse: {
        rue: "123 rue Principale",
        ville: "Paris"
    }
};

let rue = personne.adresse?.rue; // "123 rue Principale"

Dans cet exemple, personne.adresse?.rue renvoie "123 rue Principale" car adresse existe. Cependant, si adresse n'existait pas, l'expression renverrait undefined au lieu de lever une exception.

javascript
let personneSansAdresse = { nom: "Bob" };
let rueAbsente = personneSansAdresse.adresse?.rue; // undefined

Ici, comme adresse n'existe pas dans personneSansAdresse, rueAbsente est undefined.

Utilisation avec les Appels de Fonction

L'opérateur facultatif peut également être utilisé lors de l'appel de fonctions qui pourraient ne pas exister.

javascript
let resultat = objet?.maMethode?.();

Si maMethode existe et est une fonction sur objet, elle sera appelée. Sinon, resultat sera undefined.

Avantages

  • Sécurité : Réduit le risque d'erreurs en accédant à des propriétés d'objets qui peuvent ne pas exister.
  • Lisibilité : Rend le code plus lisible en évitant les longues chaînes de vérifications de null ou undefined.
  • Maintenance : Facilite la maintenance du code en réduisant la complexité des structures conditionnelles.

L'opérateur facultatif est un outil puissant pour gérer l'accès à des propriétés d'objets qui pourraient ne pas être définies, rendant le code plus propre et plus sûr.

Chaque mois, recevez en avant-première notre newsletter avec les dernières actualités, tutoriels, astuces et ressources Angular directement par email !