Javascript一行If ... else ... else if statement

时间:2015-03-13 22:39:14

标签: javascript conditional-operator

我知道你可以通过var variable = (condition) ? (true block) : (else block)来设置带有一行if / else语句的变量,但我想知道是否有办法在那里放置else if语句。任何建议都将不胜感激,谢谢大家!

7 个答案:

答案 0 :(得分:103)

当然,你可以做嵌套的三元运算符,但它们很难阅读。

var variable = (condition) ? (true block) : ((condition2) ? (true block2) : (else block2))

答案 1 :(得分:29)

TL;博士

是的,你可以...... 如果是a,那么如果是b那么如果c则c(b),否则b,否则为null

a ? a : (b ? (c ? c(b) : b) : null)

a
  ? a
  : b
      ? c
        ? c(b)
        : b
      : null

更长的版本

用作内联if-else的三元运算符?:右关联。简而言之,这意味着最右边的?首先被送入,而左侧的一个最接近的操作数和两个,带有:,在右边。

实际上,请考虑以下语句(与上述相同)

a ? a : b ? c ? c(b) : b : null

最右边的?先获取,因此找到它及其周围的三个参数并连续向左展开到另一个?

   a ? a : b ? c ? c(b) : b : null
                 ^                  <---- RTL
1.            |1-?-2----:-3|
             ^ <-
2.        |1-?|--2---------|:-3---|
     ^ <-
3.|1-?-2-:|--3--------------------|

result: a ? a : (b ? (c ? c(b) : b) : null)

这是计算机读取它的方式:

  
      
  1. 读取期限a   节点: a
  2.   
  3. 读取非终结?   节点: a ?
  4.   
  5. 读取期限a   节点: a ? a
  6.   
  7. 读取非终结:   节点: a ? a :
  8.   
  9. 读取期限b   节点: a ? a : b
  10.   
  11. 读取非终结?,触发右关联性规则。相关性决定:
      节点: a ? a : (b ?
  12.   
  13. 读取期限c   节点: a ? a : (b ? c
  14.   
  15. 读取非终结?,重新应用右关联性规则   节点: a ? a : (b ? (c ?
  16.   
  17. 读取期限c(b)   节点: a ? a : (b ? (c ? c(b)
  18.   
  19. 读取非终结:   节点: a ? a : (b ? (c ? c(b) :
  20.   
  21. 读取期限b   节点: a ? a : (b ? (c ? c(b) : b
  22.   
  23. 读取非终结:。满足前一范围内的三元运算符?:,并关闭范围   节点: a ? a : (b ? (c ? c(b) : b) :
  24.   
  25. 读取期限null   节点: a ? a : (b ? (c ? c(b) : b) : null
  26.   
  27. 没有令牌可供阅读。关闭剩余的开括号。      

    结果是:a ? a : (b ? (c ? c(b) : b) : null)

  28.   

更好的可读性

上面那个丑陋的oneliner可以重写(和应该)以便于阅读: (请注意,缩进隐式地将正确的闭包定义为方括号()。

a
  ? a
  : b
      ? c
        ? c(b)
        : b
      : null

例如

return a + some_lengthy_variable_name > another_variable
        ? "yep"
        : "nop"

更多阅读

Mozilla: JavaScript Conditional Operator
Wiki: Operator Associativity

奖励:逻辑运算符

var a = 0 // 1
var b = 20
var c = null // x=> {console.log('b is', x); return true} // return true here!

a
  && a
  || b
      && c
        && c(b) // if this returns false, || b is processed
        || b
      || null

在这个例子中使用逻辑运算符是丑陋和错误的,但这是他们闪耀的地方......

&#34;空融合&#34;

function(mayBeNull) {
  var cantBeNull = mayBeNull || 42             // "default" value
  var alsoCantBe = mayBeNull ? mayBeNull : 42  // ugly...
  ..
}

短路评估

false && (anything) // is short-circuit evaluated to false.
true || (anything)  // is short-circuit evaluated to true.

Logical operators
Null coalescence
Short-circuit evaluation

答案 2 :(得分:3)

我知道这是一个老线程,但我认为我将两分钱投入。三元运算符能够以下列方式嵌套:

var variable = conditionA ? valueA : (conditionB ? valueB: (conditionC ? valueC : valueD));

示例:

var answer = value === 'foo' ? 1 :
    (value === 'bar' ? 2 : 
        (value === 'foobar' ? 3 : 0));

答案 3 :(得分:3)

简单来说:

var x = (day == "yes") ? "Good Day!" : (day == "no") ? "Good Night!";

答案 4 :(得分:2)

这主要用于分配变量,它使用二项式调节,例如。

var time = Date().getHours(); // or something

var clockTime = time > 12 ? 'PM' : 'AM' ;

没有ElseIf,为了开发不使用链接,你可以使用switch,如果你在.js中有多个条件,它会快得多

答案 5 :(得分:1)

您可以根据需要链接尽可能多的条件。如果你这样做:

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

您将获得x="2true"

所以它可以表达为:

var variable = (condition) ? (true block) : ((condition)?(true block):(false block))

答案 6 :(得分:1)

  a === "a" ? do something
: a === "b" ? do something
: do something