多个三元运算符

Question

I need a bit of syntax help with a ternary operator which will help me to put the correct marker icons on to my good map. I have three areas 0, 1 and 2 which have unique icons 0, 1 and 2.

I used to have just two areas so this ternary operator worked fine;

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

Now I need to add an additional third icon (icon2) for area2.

I've tried various methods but just can't seem to get it right.

Answer 1

The syntax would be:

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

But this is starting to get complicated. You may well be better off just creating a function to do this work instead:

var icon = getIcon(area);

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

  return icon0;
}

Answer 2

怎么样：

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

Answer 3

For anyone that's confused about the multiple ternary syntax (like I was), it goes like this:

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

You can add as many conditions as you like.

You can read up further on https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator

Answer 4

How about an object literal.

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

icon = icons[area];

Answer 5

Very simple way

If your object is like this:

 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"

Answer 6

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