Javascript切换与if ... else if else

Posted 2021-04-13

伙计们我有几个问题：

1. javascript在switch语句和if...else之间存在性能差异吗？
2. 如果是这样的话？
3. switch和if...else的行为是否因浏览器而异？ （FireFox，IE，Chrome，Opera，Safari）

提出这个问题的原因是，似乎我在switch声明中获得了更好的性能，在Firefox中有大约1000个案例。

---

编辑不幸的是，这不是我的代码Javascript是从编译库生成服务器端，我无法访问代码。调用生成javascript的方法

CreateConditionals(string name, string arrayofvalues, string arrayofActions)

注意arrayofvalues是逗号分隔的列表。

它产生的是什么

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

注意：其中[name] =传递给服务器端功能的名称

现在我将要插入的函数的输出更改为TextArea，编写了一些JavaScript代码来解析函数，并将其转换为一组case语句。

最后我运行该功能，它运行良好但IE和Firefox的性能不同。

答案

回答一般性问题：

1. 是的，通常。
2. See More Info Here
3. 是的，因为每个都有不同的JS处理引擎，但是，在下面的站点上运行测试时，交换机总是在大量迭代时执行if，elseif。

Test site

另一答案

有时最好不要使用它。例如，在“调度”情况下，Javascript允许您以完全不同的方式执行操作：

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

通过创建对象来设置多向分支具有很多优点。您可以动态添加和删除功能。您可以从数据创建调度表。您可以通过编程方式检查它。您可以使用其他功能构建处理程序。

有一个函数调用的额外开销来获得等效的“case”，但是哈希查找的优势（当有很多情况时）找到特定键的函数。

另一答案

switch和if...else if...else之间的性能差异很小，它们基本上做同样的工作。它们之间可能产生差异的一个区别是，测试的表达式仅在switch中评估一次，同时评估每个if。如果评估表达式的成本很高，那么一次这样做当然比做一百次更快。

这些命令（以及一般所有脚本）的实现差异在浏览器之间有很大差异。在不同的浏览器中看到相同代码的相当大的性能差异是很常见的。

由于您几乎无法在所有浏览器中对所有代码进行性能测试，因此您应该选择最适合您所做工作的代码，并尝试减少完成的工作量而不是优化工作方式。

另一答案

1. 如果存在差异，它将永远不会大到足以引起注意。
2. N / A
3. 不，它们都具有相同的功能。

基本上，使用任何使代码最具可读性的东西。肯定有一个或另一个结构使得更清晰，更易读和更易于维护的地方。这远比在JavaScript代码中节省几纳秒更重要。

另一答案

除了语法之外，可以使用树来实现切换，这使得它成为O(log n)，而if / else必须使用O(n)程序方法来实现。更常见的是，它们都是在程序上处理的，唯一的区别是语法，而且它真的很重要 - 除非你静态输入10k if / else案例吗？

另一答案

在switch语句和if ... else if .... else之间是否有Javascript的性能差异？

我不这么认为，如果你想要防止多个switch条件，if-else是有用/短。

交换机的行为和if ... else if else在浏览器中有什么不同？ （FireFox，IE，Chrome，Opera，Safari）

所有浏览器的行为都相同:)

另一答案

Pointy's answer建议使用对象文字作为switch或if / else的替代品。我也喜欢这种方法，但每次调用map函数时，答案中的代码都会创建一个新的dispatch对象：

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

如果map包含大量条目，则会产生很大的开销。最好只设置一次动作贴图，然后每次使用已创建的贴图，例如：

var actions = {
    'explode': function() {
        prepExplosive();
        if( flammable() ) issueWarning();
        doExplode();
    },

    'hibernate': function() {
        if( status() == 'sleeping' ) return;
        // ... I can't keep making this stuff up
    },
    // ...
};

function dispatch( name ) {
    var action = actions[name];
    if( action ) action();
}

另一答案

1. 在某些情况下，工作台可能会导致一些非常小的差异，但处理方式依赖于浏览器，所以不值得打扰
2. 因为处理方式不同
3. 如果行为无论如何都不同，你不能称它为浏览器

另一答案

事实证明，if-else通常比switch更快

http://jsperf.com/switch-if-else/46