在JavaScript中，三元运算符、if-else和逻辑OR哪个更快？

Question

在 JavaScript 中，if-else、三元操作符和逻辑或运算符哪种方法更快或更具响应性？建议使用哪种方法，原因是什么？

- Jeff

---

这已经不是微观优化，而是像纳米级的优化。你真的会为了节省0.0000000000001毫秒而改变你的编码风格吗？ - Josh Stodola

如果这些性能差异对您很重要，那么JavaScript可能不是您应该使用的正确语言。 - Michael

为什么看到这个问题的答案我会感到如此烦恼呢？我不知道... - quemeful

Answer 1

看起来没有人进行过实际的性能分析。以下是我使用的代码：

test = function() {
    for (var i = 0; i < 10000000; i++) {
        var a = i < 100 ? 1 : 2;

        /*
        if(i < 100) {
            var a = 1;
        }else{
            var a = 2;
        }
        */
    }
}

test();

使用if/else语句块而不是三元运算符，在OS X Snow Leopard下的Google Chrome v21中可以获得1.5 - 2x的性能提升。

这在一个非常重要的应用场景中很有作用，即在JavaScript中合成实时音频变得越来越普遍。当一个算法每秒运行44100次时，这种性能差异是很重要的。

- charlie roberts

---

我今天刚发现了这个网站/测试：http://jsperf.com/ternary-vs-switch，证实了我的研究结果。然而，在Safari中运行测试时，使用三目运算符略微快一些...不想为我们简化事情 :) - charlie roberts

在Windows 8.1 64位上的32位Firefox 27中，三元运算符对我来说是最快的，Switch最慢，if-else则介于两者之间。 - Foo Bar

谢谢。我讨厌那些人在几乎任何优化问题都有合理原因的情况下说“过度优化”。 - quemeful

你的意思是性能提升（更快）还是时间增加（更慢）？ - dmvianna

更快。至少三年前...我会自己运行链接的jsperf测试，因为这样的结果肯定会发生变化。 - charlie roberts

Answer 2

我认为@charlie robert的测试不公平。

这是我的jsperf

结果：

1. 严格相等是最快的。
2. 严格三元运算符慢33%。
3. 真值假值比较慢49%。
4. 三元运算符的真值假值比较慢55%。
5. if else和三元运算符大致相同。

普通相等和普通三元运算符最慢。

严格相等：

var a = true, b;

if (a === true) {
  b = true;
} else {
  b = false
}
if (a === false) {
  b = true;
} else {
  b = false;
}

三元严格等式

var a = true, b;

b = (a === true) ? true : false;

b = (a === false) ? true : false;

简单的等式

 var a = true, b;

    if (a == true) {
      b = true;
    } else {
      b = false;
    }

    if (a == false) {
      b = true;
    } else {
      b = false;
    }

简单的三元相等性

 var a = true, b;
    b = (a == true) ? true : false;

    b = (a == false) ? true : false;

Truthy / Falsy

var a = true, b;
if (a) {
  b = true;
} else {
  b = false;
}

if (!a) {
  b = true;
} else {
  b = false;
}

三元运算符的真假值

var a = true, b;
b = (a) ? true : false;
b = (!a) ? true : false;

- Andrew Luhring

Answer 3

速度差异将是可以忽略不计的 - 使用您认为更易读的任何一种。换句话说，我非常怀疑您的代码瓶颈是否是由于使用了错误的条件结构造成的。

- Andrew Hare

---

理论上来说，这应该是可以忽略不计的。但我们需要进行测试，以确保像IE这样的浏览器没有出现问题。 - Sarsaparilla

在JavaScript处理数百万数据时，速度很重要。 - Kira

我同意这个观点，但问题是在问哪种方法更快。换句话说，这个回答并没有真正回答问题。- 实际上，我出于类似Kira提出的原因而感到好奇。 - sramzan

HTML5游戏开发者也会受益于了解这一点。我们经常使用if语句，因此可以说每毫秒都很重要，可悲的是。 - Kitanga Nday

Answer 4

为了补充Charlie Roberts上面的答案，我想补充一点：

以下链接提供了一些深入的答案；其中Firefox中开关的结果最为引人注目： http://jsperf.com/if-else-vs-arrays-vs-switch-vs-ternary/39 那些质疑为什么有人要如此深入地调优的人最好去研究WebGL！

- Jay Edwards

Answer 5

三元运算符只是语法糖，不是性能提升器。

- cwalsh003

---

根据基准测试，它是- https://jsperf.com/ternary-vs-simple-if-else - seven

Answer 6

我认为这将有助于找到if..else和三元运算符的确切速度差异。我检查了不同类型的嵌套条件，用于测试三元运算符和if else语句。结果显示，在Nodejs控制台、Chrome和Edge中，三元运算符比if..else语句更快，但在Firefox中则相反（Windows 10）。下面的代码给出了两个测试的平均时间为40毫秒。

const IfTest = () => {
  let sum = 0;
  for (let x = 0; x < 1e8; ++x) {
    if (x % 2 === 0) 
     sum += x;
    else if (x > 1e8 / 2) 
     sum += 5;
    else 
     sum += 6;
  }
};

const TernaryTest = () => {
  let sum = 0;
  for (let x = 0; x < 1e8; ++x) {
    sum += x % 2 === 0 ? x : x > 1e8 / 2 ? 5 : 6;
  }
};

const initTest = (e) => {
  let [tAverage, ifAverage] = [0, 0];
  for (let x = 0; x < e; ++x) {
    const date = new Date;
    IfTest();
    ifAverage += new Date - date;
  }
  console.log("if execution time:", ifAverage / e);

  for (let x = 0; x < e; ++x) {
    const date = new Date;
    TernaryTest();
    tAverage += new Date - date;
  }
  console.log("ternary execution time:", tAverage / e);
};

initTest(40);

- Kelvin Paul

Answer 7

我正在进行另一种语法：

var a = true,
    b;

b = (a == false) 
    ? true // if a == false, b = true
    : false; // else: a == true so b = false

    /* Equivalent of
    if(a == true)
      var b = true;
    else
      var b = false;

有些人喜欢我的代码，并告诉我它很容易阅读。

- Delbo ar

---

这可以简化为 b = !a。 - riggedCoinflip

那么多气味: 使用let而不是var; 不要声明没有值的变量; 使用严格相等; 不要注释明显的东西; let a = true; let b = !a; - YAMM

Answer 8

速度上没有区别。

有些人喜欢使用if/else语句来提高可读性。个人而言，只要逻辑足够简单易懂，我就会使用三目运算符。

- Erix