多个三元运算符

Question

我需要一些关于三元运算符的语法帮助，这将帮助我将正确的标记图标放在我的好地图上。我有三个区域 0、1 和 2，它们具有独特的图标 0、1 和 2。

我以前只有两个区域，所以这个三元运算符工作得很好；

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

现在我需要为区域 2 添加第三个图标 (icon2)。

我尝试了各种方法，但似乎都无法做到正确。

Answer 1

语法是：

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

但这开始变得复杂。您最好只创建一个函数来完成这项工作：

var icon = getIcon(area);

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

  return icon0;
}

Answer 2

对于任何对多重三元语法感到困惑的人（就像我一样），它是这样的：

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

您可以添加任意数量的条件。

您可以进一步阅读 https://developer.mozilla .org/en-US/docs/Web/JavaScript/Reference/Operators/Conditional_Operator

Answer 3

怎么样：

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

Answer 4

对象字面量怎么样？

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

icon = icons[area];

Answer 5

非常简单的方法

如果你的对象是这样的：

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;

Answer 7

一系列问号运算符 ? 可以返回一个取决于多个条件的值。

例如：

let age = prompt('age?', 18);

let message = (age < 3) ? 'Hi, baby!' :
  (age < 18) ? 'Hello!' :
  (age < 100) ? 'Greetings!' :
  'What an unusual age!';

alert( message ); 

Answer 8

condition1 ? (condition2 && condition2*Passed*) || condition2*NotPassed* : condition1NotPassed

现在，如果您的第一个条件通过，那么将考虑第二阶段，如果没有，则 else 部分（在我们的三元组中 : 之后的代码将运行；现在我们认为第一个条件已通过，因此我们处于第二阶段，此代码检查是否在此阶段条件 2 负责并且如果通过，则括号部分的输出将为true，否则括号输出将被收取或费用在这种情况下，运算符第二个操作数将被视为 if 语句的 else 部分

Answer 9

使用条件直到默认值的多个三元运算符。

    For eg:- condition1 ? Pass : condition2 ? Pass : condition3 : Pass : Default

    <iframe
    [id]="iFrameId"
    [name]="iFrameId"
    [src]="
      autoPlayEnabled && secondEnabled
        ? (data.iFrameUrl + '?autoplay=1&second=' + secondDuration | safe)
        : autoPlayEnabled && !secondEnabled
        ? (data.iFrameUrl + '?autoplay=1' | safe)
        : !autoPlayEnabled && secondEnabled
        ? (data.iFrameUrl + '?autoplay=1&second=' + secondDuration | safe)
        : (data.iFrameUrl | safe)
    "
  ></iframe>