JavaScriptスイッチとif…else if…else

みんな私はいくつか質問があります：

1. switchステートメントとのJavaScriptのパフォーマンスに違いはあり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]
  }
}

注：where [name]=サーバーサイド関数に渡される名前

次に、TextAreaに挿入されるように関数の出力を変更し、関数を解析するためのJavaScriptコードをいくつかcase記述し、それを一連のステートメントに変換しました。

最後に、関数を実行すると問題なく動作しますが、IEとFirefoxではパフォーマンスが異なります。

一般的な答え：

1. はい、通常。
2. 詳細はこちら
3. はい。ただし、JS処理エンジンはそれぞれ異なるため、以下のサイトでテストを実行すると、スイッチは常にif、elseifを多数の反復で実行しました。

テストサイト

どちらも使用しない方がよい場合もあります。たとえば、「ディスパッチ」の状況では、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();
}

オブジェクトを作成して多方向分岐を設定すると、多くの利点があります。機能は動的に追加および削除できます。データからディスパッチテーブルを作成できます。プログラムで調べることができます。他の関数を使用してハンドラーを作成できます。

「ケース」に相当する関数呼び出しのオーバーヘッドが追加されますが、特定のキーの関数を見つけるためのハッシュルックアップの利点（ケースが多数ある場合）があります。

a switchとのパフォーマンスの差if...else if...elseは小さく、基本的に同じ作業を行います。違いをもたらす可能性のあるそれらの1つの違いは、テストする式はswitch、各について評価される間、たまにしか評価されないことifです。式を評価するのにコストがかかる場合、1回行う方が100回行うよりも高速です。

これらのコマンド（およびすべてのスクリプト全般）の実装の違いは、ブラウザー間でかなり異なります。異なるブラウザの同じコードでかなり大きなパフォーマンスの違いが見られるのはよくあることです。

すべてのブラウザーですべてのコードのパフォーマンステストを行うことはほとんどできないため、実行していることに最適なコードを選び、実行方法を最適化するのではなく、実行する作業量を減らすようにしてください。

1. 違いがある場合は、気付くほどの大きさになることはありません。
2. なし
3. いいえ、すべて同じように機能します。

基本的に、コードを最も読みやすくするものを使用します。1つまたは他の構成要素がよりクリーンで読みやすく、保守しやすい場所が確実にあります。これは、JavaScriptコードで数ナノ秒を節約するよりもはるかに重要です。

構文以外に、スイッチはそれを構成するツリーを使用して実装できますがO(log n)、if / elseはO(n)手続き型のアプローチで実装する必要があります。多くの場合、それらは両方とも手続き的に処理され、唯一の違いは構文です。さらに、if / elseの10kケースを静的に入力しない限り、それは本当に重要です。

Pointyの回答は、switchor 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多数のエントリが含まれている場合、これは大きなオーバーヘッドを引き起こす可能性があります。たとえば、アクションマップを1回だけ設定して、作成済みのマップを毎回使用することをお勧めします。次に例を示します。

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();
}

switch文とif ... else if .... elseの間のJavascriptのパフォーマンスの違いはありますか？

私はそうは思わない、switchあなたが複数のif-else条件を防ぎたいなら、便利/短いです。

switchとif ... else if ... elseの動作はブラウザーによって異なりますか？（FireFox、IE、Chrome、Opera、Safari）

動作はすべてのブラウザで同じです:)

1. ワークベンチにより、場合によっては非常に小さな違いが生じる可能性がありますが、処理方法はブラウザーに依存しているため、気にする必要はありません。
2. 処理方法が異なるため
3. とにかく動作が異なる場合は、ブラウザと呼ぶことはできません

if-elseがスイッチよりも一般的に速い場合、

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