具有多个变量的三元运算符

Question

我已经了解了三元运算符的概念，理解符号非常简单：

desired_variable = true ? false ? "value1" : "value2";

然而，我无法理解添加第二个变量背后的理性，即使我理解答案。要使用经典示例：

var eatsPlants = false;
var eatsAnimals = false;
var category;

category = eatsPlants ? eatsAnimals ? "omnivore" : "herbivore" : eatsAnimals ? "carnivore" : undefined;
console.log(category)

这里有一个观察：如果我将变量的顺序更改为下面的语句，则该函数不起作用：

category = eatsAnimals ? eatsPlants? "carnivore" : undefined : eatsPlants ? "herbivore" : "omnivore";
console.log(category)

我的问题：当条款倒置时，为什么功能不起作用？当我有两个或更多变量（因此有四个或更多结果）时，如何选择术语的顺序？

Answer 1

你可以通过这个例子来理解。

x ? ( y ? a : b ) : c
|
|________true   ---> y ? a : b
|
|________false  ---> c

• 首先检查x的值，如果它是真的它将运行y ? a : b（为了便于阅读，我添加了()）
• 如果它是假的，它会去c

如果我将上面的代码改为if / else，你可以简单地理解它和if / else一样

if(x){
  if(y) {
    return a
  } else {
    return b
} else {
   return c
 }
}

Answer 2

三元表达式中有三个表达式。但是，因为三元表达式本身就是表达式，所以可以将三元表达式放在其他三元表达式中。上面示例中的三元表达式看起来很混乱，因为它们是多个嵌套的三元表达式。通过格式化和使用括号可以更好地清除这种混淆：

var eatsPlants = false;
var eatsAnimals = false;
var category = null;

category =
  (eatsPlants ?
    (eatsAnimals ? "omnivore" : "herbivore")
    :
    (eatsAnimals ? "carnivore" : undefined)
  );
console.log(category);

Answer 3

为了获得正确的结果，您可以对三元组进行分组并保持相同级别的决策。

var eatsPlants = false,
    eatsAnimals = false,
    category = eatsPlants
        ? eatsAnimals
            ? "omnivore"
            : "herbivore"
        : eatsAnimals
            ? "carnivore"
            : undefined;

console.log(category);

Answer 4

你不能改变then和else部分之间的顺序，因为这会影响结果（如果你不否定条件）。但是，您可以更改嵌套，然后写入

category = eatsPlants
  ? eatsAnimals
      ? "omnivore"
      : "herbivore"
  : eatsAnimals
      ? "carnivore"
      : undefined;

要么

category = eatsAnimals
  ? eatsPlants
      ? "omnivore"
      : "carnivore"
  : eatsPlants
      ? "herbivore"
      : undefined;

Answer 5

三元运算总是需要三个操作数，例如：

inputExpression ? outputExpressionIfTrue : outputExpressionIfFalse

问题中的代码是使用某些三元操作的输出作为其他操作的输入表达式，如果我们像在此代码片段中那样对其进行格式化，则可以更清楚地看到这些代码。在每种情况下，外部操作返回内部操作运行的结果（并且注释解释了哪个内部操作运行以及它返回的内容。）

var eatsPlants = false;
var eatsAnimals = false;
var category;

category = eatsPlants
  ? (eatsAnimals ? "omnivore" : "herbivore") // doesn't run because eatsPlants is false
  : (eatsAnimals ? "carnivore" : undefined); //returns undefined because eatsAnimals is false 
console.log(category);

category = eatsAnimals
 ? (eatsPlants ? "carnivore" : undefined) // doesn't run because eatsAnimals is false
 : (eatsPlants ? "herbivore" : "omnivore"); // returns "omnivore" because eatsPlants is false
console.log(category);

请注意，要处理具有类似属性的事物类别的信息，使用对象可能会有所帮助，例如：

const carnivore =  {
  eatsPlants: false,
  eatsAnimals: true
};
const herbivore =  {
  eatsPlants: true,
  eatsAnimals: false
};
const omnivore =  {
  eatsPlants: true,
  eatsAnimals: true
};

console.log("carnivore:");
console.log("  eatsPlants: " + carnivore.eatsPlants);
console.log("  eatsAnimals: " + carnivore.eatsAnimals);
console.log("herbivore:");
console.log("  eatsPlants: " + herbivore.eatsPlants);
console.log("  eatsAnimals: " + herbivore.eatsAnimals);
console.log("omnivore:");
console.log("  eatsPlants: " + omnivore.eatsPlants);
console.log("  eatsAnimals: " + omnivore.eatsAnimals);