如何在JavaScript中编写内联IF语句?

时间:2012-04-22 17:37:59

标签: javascript if-statement ternary-operator conditional-operator

如何在JavaScript中使用内联if语句?是否也有内联else声明?

这样的事情:

var a = 2;
var b = 3;

if(a < b) {
    // do something
}

14 个答案:

答案 0 :(得分:549)

您不一定需要jQuery。只有JavaScript才能做到这一点。

var a = 2;
var b = 3;    
var c = ((a < b) ? 'minor' : 'major');

如果值为c,则minor变量为true;如果值为major,则false变量为{{1}}。


这称为条件(三元)运算符。

https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Conditional_Operator

答案 1 :(得分:40)

有一个三元运算符,如下所示:

var c = (a < b) ? "a is less than b"  : "a is not less than b";

答案 2 :(得分:38)

对于内联编写if语句,其中的代码应该只是一个语句:

if ( a < b ) // code to be executed without curly braces;

答案 3 :(得分:30)

您也可以仅使用逻辑运算符来近似if / else。

(a && b) || c

以上内容大致相同:

a ? b : c

当然,大致相同:

if ( a ) { b } else { c }

我粗略地说,因为这种方法存在一个区别,因为您必须知道b的值将评估为真,否则您将始终获得c。基本上你必须意识到出现if () { here }的部分现在是你放置if ( here ) { }的条件的一部分。

由于JavaScripts传递/返回形成逻辑表达式的原始值之一的行为,上述情况是可能的,其中一个取决于运算符的类型。某些其他语言(如PHP)会继续执行操作的实际结果,即true或false,这意味着结果始终为true或false; e.g:

14 && 0          /// results as 0,  not false
14 || 0          /// results as 14, not true
1 && 2 && 3 && 4 /// results as 4,  not true
true && ''       /// results as ''
{} || '0'        /// results as {}

与普通的if语句相比,一个主要的好处是前两个方法可以在参数的右侧操作,即作为赋值的一部分。

d = (a && b) || c;
d = a ? b : c;

if `a == true` then `d = b` else `d = c`

使用标准if语句实现此目的的唯一方法是复制分配:

if ( a ) { d = b } else { d = c }

您可能会问为什么只使用Logical Operators代替Ternary Operator,对于您可能不会使用的简单情况,除非您想确保ab都是真的。您还可以使用逻辑运算符实现更简化的复杂条件,使用嵌套的三元运算可能会变得非常混乱......如果您希望代码易于阅读,那么这两种情况都不会那么直观。

答案 4 :(得分:29)

用简单的英语解释语法:

if(condition){
    do_something_if_condition_is_met;
}
else{
    do_something_else_if_condition_is_not_met;
}

可以写成:

condition ? do_something_if_condition_is_met : do_something_else_if_condition_is_not_met;

答案 5 :(得分:18)

<div id="ABLAHALAHOO">8008</div>
<div id="WABOOLAWADO">1110</div>

parseInt( $( '#ABLAHALAHOO' ).text()) > parseInt( $( '#WABOOLAWADO ).text()) ? alert( 'Eat potato' ) : alert( 'You starve' );

答案 6 :(得分:15)

你可以在JavaScript中这样做:

a < b ? passed() : failed();

答案 7 :(得分:12)

如果你只想要一个内联IF(没有ELSE),你可以使用逻辑AND运算符:

(a < b) && /*your code*/;

如果您还需要ELSE,请使用其他人建议的三元操作。

答案 8 :(得分:6)

我经常需要为每个条件运行更多代码,使用:( , , )可以执行多个代码元素:

var a = 2;
var b = 3;
var c = 0;

( a < b ?  ( alert('hi'), a=3, b=2, c=a*b ) : ( alert('by'), a=4, b=10, c=a/b ) );

答案 9 :(得分:5)

仅供参考,您可以撰写conditional operators

var a = (truthy) ? 1 : (falsy) ? 2 : 3;

如果您的逻辑足够复杂,那么您可以考虑使用IIFE

var a = (function () {
  if (truthy) return 1;
  else if (falsy) return 2;
  return 3;
})();

当然,如果你计划不止一次使用这个逻辑,那么你应该把它封装在一个函数中以保持良好和干燥。

答案 10 :(得分:3)

要添加到此,您还可以使用内联if条件&amp;&amp;和||运营商。 喜欢这个

var a = 2;
var b = 0;

var c = (a > b || b == 0)? "do something" : "do something else";

答案 11 :(得分:1)

内联,如果:

(('hypothesis') ? 'truthy conclusion' : 'falsey conclusion')

真实结论:假说成立时执行的语句

假结论:假设为假时执行的语句

您的示例:

var c = ((a < b) ? 'a<b statements' : '!(a<b) statements');

答案 12 :(得分:0)

本质上不是问题:我可以写下以下内容吗?

if (foo)
  console.log(bar)
else
  console.log(foo + bar)

答案是肯定的,以上内容将会翻译。

但是,要小心做以下事情

if (foo)
  if (bar)
    console.log(foo)
  else 
    console.log(bar)
else 
  console.log(foobar)

一定要在括号中包含含糊不清的代码,因为上面会引发异常(类似的排列会产生不良行为。)

答案 13 :(得分:0)

简化三元运算符

var locked = 1;
var canChange = locked != 1 ? true : false;

如果locked为1,则将canChange变量设置为false,否则设置为true。 在这种情况下,您可以使用布尔表达式来简化它,如下所示:

var locked = 1;
var canChange = locked != 1;

对于多个 JavaScript 三元运算符 以下示例显示如何在同一表达式中使用两个三元运算符:

var speed = 90;
var message = speed >= 120 ? 'Too Fast' : (speed >= 80 ? 'Fast' : 'OK');
console.log(message);

最好的做法是使用三元运算符使代码更易于阅读。如果逻辑包含许多 if...else 语句,则不应使用三元运算符。