Javascriptの条件付き構造体の以下の実装のパフォーマンスについて疑問に思っていました。
方法1:
if(id==="camelCase"){
window.location.href = "http://www.thecamelcase.com";
}else if (id==="jsFiddle"){
window.location.href = "http://jsfiddle.net/";
}else if (id==="cricInfo"){
window.location.href = "http://cricinfo.com/";
}else if (id==="Apple"){
window.location.href = "http://Apple.com/";
}else if (id==="yahoo"){
window.location.href = "http://yahoo.com/";
}
方法2:
switch (id) {
case 'camelCase':
window.location.href = "http://www.thecamelcase.com";
break;
case 'jsFiddle':
window.location.href = "http://www.jsfiddle.net";
break;
case 'cricInfo':
window.location.href = "http://www.cricinfo.com";
break;
case 'Apple':
window.location.href = "http://www.Apple.com";
break;
case 'yahoo':
window.location.href = "http://www.yahoo.com";
break;
}
方法
var hrefMap = {
camelCase : "http://www.thecamelcase.com",
jsFiddle: "http://www.jsfiddle.net",
cricInfo: "http://www.cricinfo.com",
Apple: "http://www.Apple.com",
yahoo: "http://www.yahoo.com"
};
window.location.href = hrefMap[id];
方法4
window.location.href = {
camelCase : "http://www.thecamelcase.com",
jsFiddle: "http://www.jsfiddle.net",
cricInfo: "http://www.cricinfo.com",
Apple: "http://www.Apple.com",
yahoo: "http://www.yahoo.com"
}[id];
おそらく方法3と4のパフォーマンスはほぼ同じかもしれませんが、確認のために投稿するだけです。
この JSBen.ch テストによると、switch
セットアップは提供されたメソッド(Firefox 8.0およびChromium 15)の中で最も高速です。
方法3と4の速度は若干遅くなりますが、ほとんど目立ちません。明らかに、if-elseifメソッドはかなり遅い(FireFox 8.0)。
Chromium 15での同じテストでは、これらの方法のパフォーマンスに大きな違いはありません。実際、if-elseifメソッドはChromeで最速のメソッドのようです。
テストケース again を10個の追加エントリとともに実行しました。 hrefmap(方法3および4)は、より良いパフォーマンスを示しています。
関数に比較メソッドを実装する場合、メソッド3は間違いなく勝ちます。マップを変数に保存し、後で再構築するのではなく、この変数を参照します。
jsPerf 自分でいつでもテストできます。ただし、一般的にルックアップテーブルはデータにアクセスする最も速い方法です。スニペットでは(3)になります。また、switch/case
はほとんどの場合if-else
。したがって、あなたの例の順序は
(3)->(4)->(2)->(1)