如何在JavaScript中使用内联if
语句?是否还有内联else
声明?
像这样的东西:
var a = 2;
var b = 3;
if(a < b) {
// do something
}
你不一定需要jQuery。只有JavaScript才能做到这一点。
var a = 2;
var b = 3;
var c = ((a < b) ? 'minor' : 'major');
如果值为c
,则minor
变量为true
;如果值为major
,则为false
。
这被称为条件(三元)运算符。
https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Conditional_Operator
仅供参考,你可以撰写conditional operators
var a = (truthy) ? 1 : (falsy) ? 2 : 3;
如果你的逻辑足够复杂,那么你可以考虑使用IIFE
var a = (function () {
if (truthy) return 1;
else if (falsy) return 2;
return 3;
})();
当然,如果你计划不止一次使用这个逻辑,那么你应该将它封装在一个函数中以保持良好和干燥。
要添加到此,您还可以使用带&&和||的内联if条件运营商。像这样
var a = 2;
var b = 0;
var c = (a > b || b == 0)? "do something" : "do something else";
本质上不是问题:我可以写下面的内容吗?
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)
一定要在括号中包含含糊不清的代码,因为上面会引发异常(类似的排列会产生不希望的行为。)
有一个三元运算符,像这样:
var c = (a < b) ? "a is less than b" : "a is not less than b";
对于内联编写if
语句,其中的代码应该只是一个语句:
if ( a < b ) // code to be executed without curly braces;
您也可以仅使用逻辑运算符来近似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;例如:
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,对于简单的情况你可能不会,除非你想确保a
和b
都是真的。您还可以使用逻辑运算符实现更简化的复杂条件,使用嵌套的三元运算可能会变得非常混乱......如果您希望代码易于阅读,那么这两者都不是那么直观。
用简单的英语,语法解释如下:
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;
<div id="ABLAHALAHOO">8008</div>
<div id="WABOOLAWADO">1110</div>
parseInt( $( '#ABLAHALAHOO' ).text()) > parseInt( $( '#WABOOLAWADO ).text()) ? alert( 'Eat potato' ) : alert( 'You starve' );
你可以在JavaScript中这样做:
a < b ? passed() : failed();
如果您只想要一个内联IF(没有ELSE),您可以使用逻辑AND运算符:
(a < b) && /*your code*/;
如果您还需要ELSE,请使用其他人建议的三元操作。
我经常需要在每个条件下运行更多代码,使用:( , , )
可以执行多个代码元素:
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 ) );