web-dev-qa-db-ja.com

複数の三項演算子

正しいマーカーアイコンを適切なマップに配置するのに役立つ、3項演算子を使用した構文のヘルプが少し必要です。0、1、および2という一意のアイコンを持つ3つの領域0、1、および2があります。

以前は2つの領域しかなかったため、この3項演算子は正常に機能しました。

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

次に、area2に3つ目のアイコン（icon2）を追加する必要があります。

私はさまざまな方法を試しましたが、うまくいかないようです。

javascriptternary-operator
30
Sam

構文は次のとおりです。

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

しかし、これは複雑になり始めています。代わりに、この作業を行う関数を作成する方が良いでしょう：

icon: getIcon(area),

...

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

  return icon0;
}
49
Justin Ethier

どうですか：

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

非常に簡単な方法

オブジェクトが次のような場合：

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

オブジェクトリテラルはどうですか。

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

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

複数の三項構文（私がそうだったように）について混乱している人にとっては、次のようになります。

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

必要な数の条件を追加できます。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator でさらに読むことができます。

2
Adam