Opérateurs ternaires multiples

Question

J'ai besoin d'un peu d'aide sur la syntaxe avec un opérateur ternaire qui m'aidera à mettre les bonnes icônes de marqueur sur ma bonne carte. J'ai trois zones 0, 1 et 2 qui ont des icônes uniques 0, 1 et 2.

Avant, je n'avais que deux zones, donc cet opérateur ternaire fonctionnait bien ;

 var icon = (area == 1) ? icon1 : icon0;

Maintenant, je dois ajouter une troisième icône supplémentaire (icon2) pour area2.

J'ai essayé différentes méthodes mais je n'arrive pas à faire les choses correctement.

Answer 1

La syntaxe serait :

 var icon = (area == 1) ? icon1 : (area == 2) ? icon2 : icon0;

Mais cela commence à se compliquer. Vous feriez peut-être mieux de créer une fonction pour faire ce travail à la place :

 var icon = getIcon(area);

function getIcon(area) {
  if (area == 1) { 
    return icon1; 
  } else if (area == 2) { 
    return icon2; 
  }

  return icon0;
}

Answer 2

Pour tous ceux qui sont confus au sujet de la syntaxe ternaire multiple (comme je l'étais), cela se passe comme ceci :

 var yourVar = condition1 ? someValue
            : condition2 ? anotherValue
            : defaultValue;

Vous pouvez ajouter autant de conditions que vous le souhaitez.

Vous pouvez en savoir plus sur https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator

Answer 3

Que diriez-vous:

 var icon = [ icon0, icon1, icon2 ][area];

Answer 4

Que diriez-vous d'un objet littéral.

 icons = {
    0: icon0,
    1: icon1,
    2: icon2
}

icon = icons[area];

Answer 5

Manière très simple

Si votre objet est comme ceci :

 var obj = {
  x: true,
  y: {
    xy: 'some value'
  }
}

var result = obj ? obj.y ? obj.y.xy ? obj.y.xy : 'N/A' : 'N/A' : 'N/A'

console.log(result) // "some value"