带有函数的JavaScript三元运算符示例

我正在使用jQuery 1.7.1

我刚开始使用JavaScript三元运算符来replace简单的if / else语句。 我在几个地方都成功地做到了。 当我确信它不会成功的时候，我成功地做了别的工作，我感到很惊讶，但是我仍然尝试过。

原来的陈述如下：

function updateItem() { $this = $(this); var IsChecked = $this.hasClass("IsChecked"); if (IsChecked == true){ removeItem($this); } else { addItem($this); } } 

下面是使用三元运算符的相同函数：

 function updateItem() { $this = $(this); var IsChecked = $this.hasClass("IsChecked"); (IsChecked == true) ? removeItem($this) : addItem($this); } 

我很惊讶，因为我看到的所有例子都只是设置这样的variables：

 x = (1 < 2) ? true : false; 

我的问题是这是否是“正常的”使用，并将在大多数JavaScript版本中工作？ 它会在哪里失败？ 还有其他不太明显的用途吗？

更新 – 感谢“现实世界”的意见！

我用这个作为我的function：

 function updateItem() { $this = $(this); $this.hasClass("IsChecked") ? removeItem($this) : addItem($this); } 

Answer 1

呃，在你的问题中有一些非常令人兴奋的三元语法的用法。 我喜欢最后一个最好的…

 x = (1 < 2) ? true : false; 

这里三元的使用完全是不合情理的 – 你可以简单地写

 x = (1 < 2); 

同样，三元语句的条件元素总是作为一个布尔值进行计算，因此可以表示：

 (IsChecked == true) ? removeItem($this) : addItem($this); 

简单地说：

 (IsChecked) ? removeItem($this) : addItem($this); 

事实上，我也将删除IsChecked临时以及离开你：

 ($this.hasClass("IsChecked")) ? removeItem($this) : addItem($this); 

至于这是可接受的语法，它当然是！ 在不影响可读性的情况下，将四行代码合并为一个代码是一种好方法。 我会给你的唯一build议是避免在同一行嵌套多个三元语句（这就是疯狂！）

Answer 2

三元风格通常用于节省空间。 在语义上，它们是相同的。 我更喜欢用完整的if / then / else语法，因为我不喜欢牺牲可读性 – 我是老派，我更喜欢我的大括号。

完整的if / then / else格式几乎用于一切。 如果你在每个分支中进入更大的代码块，你有一个多分支的if / else树，或者多个else / ifs在一个长的string中，这是特别stream行的。

在基于简单条件为variables赋值时，三元运算符很常见，或者您要以非常简短的结果做出多个决策。 你引用的例子实际上是没有意义的，因为expression式将评估为两个值之一，而没有任何额外的逻辑。

好主意：

 this > that ? alert(this) : alert(that); //nice and short, little loss of meaning if(expression) //longer blocks but organized and can be grasped by humans { //35 lines of code here } else if (something_else) { //40 more lines here } else if (another_one) /etc, etc { ... 

不太好：

 this > that ? testFucntion() ? thirdFunction() ? imlost() : whathappuh() : lostinsyntax() : thisisprobablybrokennow() ? //I'm lost in my own (awful) example by now. //Not complete... or for average humans to read. if(this != that) //Ternary would be done by now { x = this; } else } x = this + 2; } 

一个非常基本的经验法则 – 你能理解整个事情吗？ 三元组没问题 否则展开它。

Answer 3

你发布的例子没有什么特别的棘手。

在三元运算符中，计算第一个参数（条件），如果结果为true ，则计算并返回第二个参数，否则计算并返回第三个参数。 每个参数都可以是任何有效的代码块，包括函数调用。

这样想：

 var x = (1 < 2) ? true : false; 

也可以写成：

 var x = (1 < 2) ? getTrueValue() : getFalseValue(); 

这是完全有效的，这些函数可以包含任何代码，无论它是否与返回值有关。 此外，三元操作的结果不必分配给任何东西，就像函数结果不需要分配给任何东西一样：

 (1 < 2) ? getTrueValue() : getFalseValue(); 

现在简单地用任意的函数replace那些函数，然后就像你的例子一样：

 (1 < 2) ? removeItem($this) : addItem($this); 

现在你的最后一个例子根本不需要三元组，因为它可以这样写：

 x = (1 < 2); // x will be set to "true" 

Answer 4

如果你要嵌套三元运算符，我相信你会想要做这样的事情：

  var audience = (countrycode == 'eu') ? 'audienceEU' : (countrycode == 'jp') ? 'audienceJP' : (countrycode == 'cn') ? 'audienceCN' : 'audienceUS'; 

写入/读取比写入/读取效率高很多：

 var audience = 'audienceUS'; if countrycode == 'eu' { audience = 'audienceEU'; } else if countrycode == 'jp' { audience = 'audienceJP'; } else if countrycode == 'cn' { audience = 'audienceCN'; } 

就像所有好的编程一样，空白对于那些在完成项目之后必须阅读代码的人来说是非常好的。

Answer 5

我也想添加一些东西。

用三元运算符调用函数的其他可能的语法是：

 (condition ? fn1 : fn2)(); 

如果您必须将相同的参数列表传递给两个函数，那么它可能会很方便，所以您只需要将它们写入一次即可。

 (condition ? fn1 : fn2)(arg1, arg2, arg3, arg4, arg5); 

你甚至可以使用三元运算符来处理成员函数的名字，我个人非常喜欢这个名字来节省空间：

 $('.some-element')[showThisElement ? 'addClass' : 'removeClass']('visible'); 

要么

 $('.some-element')[(showThisElement ? 'add' : 'remove') + 'Class']('visible'); 

另一个例子：

 var addToEnd = true; //or false var list = [1,2,3,4]; list[addToEnd ? 'push' : 'unshift'](5); 

Answer 6

我知道问题已经回答了。

但是让我在这里添加一点。 这不仅是真实或错误的情况。 见下文：

 var val="Do"; Var c= (val == "Do" || val == "Done") ? 7 : 0 

如果val是Do或者Done，那么c将是7否则它将是零。 在这种情况下，c将是7。

这实际上是这个运营商的另一个angular度。