if-else,switch或基于map的条件的性能

Question

我想知道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;

}

方法3

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可能具有几乎相同的性能,但只是发布以确认.

Answer 1

根据这个JSBen.ch测试,switch设置是提供的方法中最快的(Firefox 8.0和Chromium 15).

方法3和4的速度稍慢,但几乎不可察觉.显然,if-elseif方法明显变慢(FireFox 8.0).

在Chromium 15中的相同测试未显示这些方法之间的性能的显着差异.事实上,if-elseif方法似乎是Chrome中最快的方法.

更新

我再次运行测试用例,另外还有10个条目.hrefmap(方法3和4)显示出更好的性能.

如果要在函数中实现compare方法,方法3肯定会获胜:将映射存储在变量中,稍后引用此变量,而不是重构它.

Answer 2

你总是可以自己做一个jsPerf测试.但是,通常查找表是访问数据的最快方式.那将是(3)你的片段.而且,switch/case几乎总是比if-else.所以你的例子的顺序是

(3) - > (4) - > (2) - > (1)