web-dev-qa-db-fra.com

Performances du conditionnement if-else, switch ou map

Je me posais des questions sur les performances des implémentations suivantes de structures conditionnelles en javascript.

Méthode 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/";
}

Méthode 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;

}

Méthode

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];

Méthode 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];

Probablement les méthodes 3 et 4 pourraient avoir presque les mêmes performances, mais juste pour valider.

javascriptswitch-statementif-statement
60
aditya_gaur

Selon ce test JSBen.ch , la configuration switch est la plus rapide parmi les méthodes fournies (Firefox 8.0 et Chromium 15).

Les méthodes 3 et 4 sont légèrement moins rapides, mais elles sont à peine perceptibles. De toute évidence, la méthode if-elseif est considérablement plus lente (FireFox 8.0).

Le même test dans Chromium 15 ne montre pas de différences significatives de performances entre ces méthodes. En fait, la méthode if-elseif semble être la méthode la plus rapide dans Chrome.

Mise à jour

J'ai exécuté les cas de test encore , avec 10 entrées supplémentaires. Le hrefmap (méthodes 3 et 4) montre de meilleures performances.

Si vous voulez implémenter la méthode de comparaison dans une fonction, la méthode 3 gagnerait certainement: Stockez la carte dans une variable et référez-vous à cette variable ultérieurement, au lieu de la reconstruire.

62
Rob W

Vous pouvez toujours faire un test jsPerf vous-même. Cependant, en général, une table de recherche est le moyen le plus rapide d'accéder aux données. Ce serait (3) dans vos extraits. Également, switch/case est presque toujours plus rapide que if-else. Ainsi, l'ordre de votre exemple serait

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

16
jAndy