web-dev-qa-db-fra.com

Opérateurs ternaires multiples

J'ai besoin d'un peu d'aide sur la syntaxe avec un opérateur ternaire qui m'aidera à mettre les icônes de marqueur correctes 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;

icon: (area == 1) ? icon1: icon0,

Maintenant, je dois ajouter une troisième icône supplémentaire (icône2) pour la zone2.

J'ai essayé différentes méthodes, mais je n'arrive pas à comprendre.

javascriptternary-operator
30
Sam

La syntaxe serait:

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

Mais cela commence à se compliquer. Il serait peut-être préférable de simplement créer une fonction pour faire ce travail à la place:

icon: getIcon(area),

...

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

  return icon0;
}
49
Justin Ethier

Que diriez-vous:

icon: [ icon0, icon1, icon2 ][area],
21
Pointy

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"
8
Sushil Dhayal

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

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

icon = icons[area];
8
Bruno
icon: (area == 0) ? icon0 : (area == 1) ? icon1 : icon2,
3
John Hartsock

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

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

Vous pouvez ajouter autant de conditions que vous le souhaitez.

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

2
Adam