Javascript - 多语句的三元运算符

Javascript - Ternary Operator with Multiple Statements

提问by Steve

Is this valid JavaScript? I saw an example where someone used commas in the ternary operator conditions, and it was marked as an error in my editor, and the example didn't run in Chrome. However, it did run in Firefox. Once I converted all the ternary statements to if/else statements, the app ran on Chrome.

这是有效的 JavaScript 吗？我看到一个例子，有人在三元运算符条件中使用了逗号，在我的编辑器中被标记为错误，并且该示例没有在 Chrome 中运行。但是，它确实在 Firefox 中运行。一旦我将所有三元语句转换为 if/else 语句，应用程序就可以在 Chrome 上运行。

a!==b ? (a=1, b=2) : (a=2, b=1)

Edit:

编辑：

This is the actual statement in the code:

这是代码中的实际语句：

a!==0?b<0?(h=b/a,e=h-1,f=-2*b+2*a*e,i=-2*b+2*a*h,d=2*h*a-2*b-2*a):(h=b/a,e=h+1,f=2*b-2*a*e,i=2*b-2*a*h,d=-2*h*a+2*b):d=h=e=f=i=0

采纳答案by T.J. Crowder

Yes, it's valid, and it runs fine in Chrome:

是的，它是有效的，并且在 Chrome 中运行良好：

var a, b, c;

a = 6;
b = 7;
c = a !== b ? (a = 1, b = 2) : (a = 2, b = 1);
console.log("a = " + a);
console.log("b = " + b);
console.log("c = " + c);

I'm not saying it's a remotely good idea in code humansare meant to read. :-) I expect jamietre is correct in the comments when he/she says it looks like the result of minification.

我并不是说这是人类应该阅读的代码中的一个好主意。:-) 我希望 jamietre 在评论中是正确的，当他/她说它看起来像是缩小的结果时。

The comma operatoris a binary operator (an operator accepting two operands). It evaluates its left-hand operand (thus causing any side-effects it has, such as assignment), throws that result away, then evalutes its right-hand operand (thus causing its side-effects if any) and takes that result as its result value. If you have multiple comma operators in a row, the overall expression is evaluated in order, left-to-right, with the final result being the value resulting from the right-most operand evaluation.

的逗号操作者是一个二进制运算符（操作者接受两个操作数）。它评估它的左侧操作数（从而导致它具有的任何副作用，例如赋值），将该结果丢弃，然后评估其右侧操作数（从而导致其副作用（如果有的话））并将该结果作为它的结果值。如果一行中有多个逗号运算符，则整个表达式按从左到右的顺序计算，最终结果是最右侧操作数计算的结果。

And of course, you know the conditional operator (a ternary operator — one accepting three operands) is used to pick one of two sub-expressions to evaluate, on the basis of an initial expression.

当然，您知道条件运算符（三元运算符 - 一个接受三个操作数）用于根据初始表达式从两个子表达式中选择一个进行求值。

So that line is very...expressive...what with a total of seven* different expressions inside it.

所以那条线非常......富有表现力......里面总共有七个*不同的表达方式。

So in that example, the result of the overall expression is 2 if a !== binitially, or 1if a === binitially, with the side-effects of setting aand b.

因此，在这个例子中，整体的表达式的结果是2，如果a !== b最初，或者1如果a === b最初用设定的副作用a和b。

It's the side effects that make it, in my view, a questionable choice. And of course, there's no reason to use the comma operator if the left-hand operand doesn'thave side effects.

在我看来，它的副作用使它成为一个有问题的选择。当然，如果左侧操作数没有副作用，就没有理由使用逗号运算符。

---

---

* Yes, sevenof 'em packed into that overall ternary:

* 是的，其中七个包含在整个三元组中：

• a !== b
• the first comma expression
• a = 1
• b = 2
• the second comma expression
• a = 2
• b = 1

• a !== b
• 第一个逗号表达式
• a = 1
• b = 2
• 第二个逗号表达式
• a = 2
• b = 1

---

---

Re your edit with the actual statement, that one works too:

使用实际语句重新编辑，该语句也有效：

function test(a) {
    var b = 7,
        d = 1,
        e = 2,
        f = 3,
        g = 4,
        h = 5,
        i = 6;
    
    a!==0?b<0?(h=b/a,e=h-1,f=-2*b+2*a*e,i=-2*b+2*a*h,d=2*h*a-2*b-2*a):(h=b/a,e=h+1,f=2*b-2*a*e,i=2*b-2*a*h,d=-2*h*a+2*b):d=h=e=f=i=0;
    
    console.log("a = " + a);
    console.log("b = " + b);
    console.log("d = " + d);
    console.log("e = " + e);
    console.log("f = " + f);
    console.log("g = " + g);
    console.log("h = " + h);
    console.log("i = " + i);
}

test(0);
test(1);

.as-console-wrapper {
  max-height: 100% !important;
}

But wow, I hope this is minified, because if a person wrote that, they must reallyhave a thing against anyone who's supposed to maintain it later... ;-)

但是，哇，我希望这已经过压缩，因为如果一个人写的，他们必须真的有人得罪谁的后面应该保持它的事情... ;-)

回答by Sarfraz

Yes:

是的：

a=1;
b=2;

a!==b ? (a=1, b=2) : (a=2, b=1)

console.log(a);     // 1
console.log(b);     // 2

and:

和：

a=1;
b=2;

a===b ? (a=1, b=2) : (a=2, b=1)

console.log(a);     // 2
console.log(b);     // 1

As you can analyze, changing the equality operator reacts correctly to our test if you look at the results.

正如您可以分析的那样，如果您查看结果，更改相等运算符会对我们的测试做出正确反应。

回答by TK Omble

Or you can do this :

或者你可以这样做：

b = a!==b ? (a=1,2) : (a=2,1);

Read hereabout comma operator.

在此处阅读有关逗号运算符的信息。

The comma operator evaluates each of its operands (from left to right) and returns the value of the last operand.

逗号运算符计算其每个操作数（从左到右）并返回最后一个操作数的值。

回答by Gregg Burns

Expanding on this topic with ES6 code example. If you're using one side of the TRUE : FALSE argument to iterate thru all cases in one IF, it makes sense to separate the code as if it's a switch | case statement.

使用 ES6 代码示例扩展这个主题。如果您使用 TRUE : FALSE 参数的一侧来遍历一个 IF 中的所有情况，那么将代码分开就好像它是一个开关一样有意义。案例陈述。

Nesting implies that there is branching logic, while it is logically nested, writing nested IF's complicates what we're doing in my example. Like a lawyer over explaining a problem to a jury. IMO, you want to explain the point in it's simplest form. For instance, I find this example the most logical way of expressing nested ifs where the TRUE is executed. The final false is your last else {} choreDoor is either 0,1 or 2:

嵌套意味着存在分支逻辑，虽然它在逻辑上是嵌套的，但编写嵌套的 IF 会使我们在我的示例中所做的事情变得复杂。就像律师向陪审团解释问题一样。IMO，您想以最简单的形式解释这一点。例如，我发现这个例子是表达 TRUE 执行的嵌套 ifs 的最合乎逻辑的方式。最后一个 false 是你的最后一个 else {} choreDoor 是 0,1 或 2：

choreDoor === 0 ? 
   (openDoor1 = botDoorPath,
    openDoor2 = beachDoorPath,
    openDoor3 = spaceDoorPath)
: choreDoor === 1 ? 
   (openDoor2 = botDoorPath,
    openDoor1 = beachDoorPath, 
    openDoor3 = spaceDoorPath) 
: choreDoor === 2 ?
   (openDoor3 = botDoorPath,
    openDoor1 = beachDoorPath, 
    openDoor2 = spaceDoorPath)
: false;