【问题标题】:What is the difference between using '&&' and '||' over a ternary operator ('?' and ':')?使用'&&'和'||'有什么区别通过三元运算符('?'和':')?
【发布时间】:2018-12-05 16:30:20
【问题描述】:

在JavaScript中,使用和使用有什么区别

true ? 'Hello' : 'Goodbye' //Evaluates to "Hello"

false ? 'Hello' : 'Goodbye' //Evaluates to "Goodbye"

true && 'Hello' || 'Goodbye' //Evaluates to "Hello"

false && 'Hello' || 'Goodbye' //Evaluates to "Goodbye"

【问题讨论】:

  • 后者取决于"Hello" 的值是否真实。考虑true && false || truetrue ? false : true
  • 第一个在 IMO 上更具可读性。

标签: javascript conditional conditional-operator


【解决方案1】:

这是两个不同的概念,恰好给你相同的答案。


第一个示例使用ternary operator 并且其结果取决于第一个操作数(在您的示例中为true/false):

true ? 'Hello' : 'Goodbye' //Evaluates to "Hello"
false ? 'Hello' : 'Goodbye' //Evaluates to "Goodbye"

它是if/else 的简写形式。如果第一个操作数为真,则返回第二个操作数 (Hello)。如果第一个操作数为假,则返回第三个操作数 (Goodbye)。

你的第一个例子的第一个表达式可以重写为:

if (true)
    return 'Hello';
else
    return 'Goodbye';

第二个示例使用logical operators其结果取决于两个第一个和第二个操作数

true && 'Hello' || 'Goodbye' //Evaluates to "Hello"
false && 'Hello' || 'Goodbye' //Evaluates to "Goodbye"

如果firstOperand && secondOperand 的计算结果为真值,则返回secondOperand。如果他们的评估结果是虚假的,请返回 thirdOperand (Goodbye)。

在您的示例中,由于非空字符串为真,true && 'Hello' 的计算结果为 Hellofalse && 'Hello' 的计算结果为 false

所以你的第二个例子变成了:

'Hello' || 'Goodbye'
false || 'Goodbye'

由于|| 的工作原理,这恰好输出您的第一个示例输出的内容,但它们是不同的概念。

请注意,在第一个示例中,我们知道在计算第一个操作数后要返回什么。在第二个示例中,我们必须先计算前 两个 操作数,然后才能知道要返回什么。

【讨论】:

    【解决方案2】:

    三元运算符

    这是if else的简写。

    true ? 'Hello' : 'Goodbye'
    

    等价于

    if (true) {
        'Hello'
    } else {
        'Goodbye'
    }
    

    逻辑谓词

    true && 'Hello' || 'Goodbye' 不是if else 条件

    true && 'Hello' || 'Goodbye'
    

    等价于

    (true && 'Hello') || 'Goodbye'
    

    这会产生Hello,但它基于优先级。考虑

    的情况
    'Goodbye' || (true && 'Hello')
    

    这将导致Goodbye。更改顺序会更改输出,但三元运算符不会发生这种情况。

    【讨论】:

      【解决方案3】:

      似乎结果没有区别。但我猜测它们是如何处理的。 ()?: 实际上比 &&|| 快一点点(参见下面的演示)。

      (A)B?C: 基本上是一个 IF 简写,所以 (A) 部分被评估,然后选择 B thenC else 堆栈。

      (A)&&B||C 得到完全评估。首先评估(A)。之后会发生一些implicit conversion(Boolean conversion) - 这需要一些时间

      false - 感谢“Gust van de Wal”

      还是有区别的:fiddle

      var max = 1e7;
      
      var start1 = (new Date()).getTime();
      for( var i = 0; i < max; i++) {
        let a = (i%2) ? max-i : max+1;
        let b = (i%3) ? max-i : max+i;
      }
      var stop1 = (new Date()).getTime();
      
      var start2 = (new Date()).getTime();
      for( var i = 0; i < max; i++) {
        let a = (i%2) && max-i || max+i;
        let b = (i%3) && max-i || max+i;
      }
      var stop2 = (new Date()).getTime();
      
      console.log( (new Date()).getTime() );
      
      console.log( stop1 -start1 );
      console.log( stop2 -start2 );

      【讨论】:

      • Short-circuiting logical operators 绝对是一个东西,虽然
      • 其实还有一个区别。它对于无分支代码很有用。这可以防止分支预测失败。
      • 我的意思是你的回答有误。当 A 和 B 都为真时,“(A)&&B||C 被完全评估”是不正确的
      • 是的,你是对的!看看this fiddle。仅在一种情况下仍然存在差异。
      • “还有”吗?短路解释了这种行为,所以我真的不明白你在这里得到什么
      【解决方案4】:

      您的第一个案例是内联 if 语句的示例,而您的第二个案例是逻辑谓词的示例。

      【讨论】:

        猜你喜欢
        • 2021-04-20
        • 2020-09-12
        • 1970-01-01
        • 2019-07-09
        • 1970-01-01
        • 2022-06-10
        • 1970-01-01
        • 2018-08-16
        • 2012-10-10
        相关资源
        最近更新 更多