mozilla
Vos résultats de recherche

    L'opérateur conditionnel

    L'opérateur (ternaire) conditionnel est le seul opérateur JavaScript qui comporte trois opérandes. Cet opérateur est fréquemment utilisé comme raccourci pour remplacer des instructions if...else simples.

    Syntaxe

    condition ? expr1 : expr2 

    Paramètres

    condition
    Une expression qui est évaluée en un booléen (true ou false).
    expr1, expr2
    Des expressions dont la valeur peut être de n'importe quel type.

    Description

    SI condition vaut true, l'opérateur renverra la valeur d'expr1, dans le cas contraire, il renverra la valeur d'expr2. Par exemple, on peut afficher un message différent en fonction d'une variable aRéduc :

    "Le prix est : " + (aRéduc ? "15 €" : "30 €")
    

    On peut également affecter des variables dont la valeur dépendra du test :

    var elvisLives = Math.PI > 4 ? "Yep" : "Nope";

    On peut enchaîner plusieurs évaluations ternaires l'une à la suite de l'autre (cet opérateur se propage de la gauche vers la droite) :

    var premierContrôle = false,
        secondContrôle = false,
        accès = premierContrôle ? "Accès refusé" : secondContrôle ? "Accès refusé" : "Accès autorisé";
      
    console.log(accès); // "Accès autorisé"

    Il est également possible d'utiliser cet opérateur pour effectuer l'une ou l'autre expression selon le cas de figure qui se présente :

    var stop = false, âge = 16;
    
    âge > 18 ? location.assign("continue.html") : stop = true;
    

    en utilisant l'opérateur virgule, on peut même y placer plusieurs instructions (attention toutefois à la lisibilité et à se demander si un if...else n'est pas plus approprié).

    var stop = false, âge = 23;
    
    âge > 18 ? (
        console.log("OK, accès autorisé."),
        location.assign("continue.html")
    ) : (
        stop = true,
        console.log("Accès refusé !")
    );
    

    De la même façon, on peut effectuer plusieurs opérations avant d'affecter le résultat de l'opérateur à une variable. Conformément à l'opérateur virgule, ce sera la dernière valeur qui sera affectée. Ici aussi, attention à la lisibilité du code relativement à un if...else.

    var âge = 16;
    
    var url = âge > 18 ? (
        console.log("Accès autorisé."), 
        // console.log renvoie "undefined", mais cela importe peu car
        // ce n'est pas le dernier élément de l'expression
        "continue.html" // la valeur à affecter si âge > 18
    ) : (
        console.log("Accès refusé !"),
        // etc.
        "stop.html" // la valeur à affecter si âge <= 18
    );
    
    location.assign(url); // "stop.html"

    Spécifications

    Spécification Statut Commentaires
    Première édition d'ECMAScript. Standard Définition initiale. Implémentée par JavaScript 1.0
    ECMAScript 5.1 (ECMA-262)
    La définition de 'The conditional operator' dans cette spécification.
    Standard  
    ECMAScript 6 (ECMA-262)
    La définition de 'Conditional Operator' dans cette spécification.
    En cours de validation comme recommandation  

    Compatibilité des navigateurs

    Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari
    Support simple (Oui) (Oui) (Oui) (Oui) (Oui)
    Fonctionnalité Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    Support simple (Oui) (Oui) (Oui) (Oui) (Oui) (Oui)

    Voir aussi

    Étiquettes et contributeurs liés au document

    Contributors to this page: BenoitL, Jeremie, SphinxKnight, teoli
    Dernière mise à jour par : SphinxKnight,
    Masquer la barre latérale