JavaScript
if文
switch文
性能

if文とswitch文の書き分けにいつも迷うのでまとめてみた


if文とswitch文一緒じゃね?

みなさんも思ったことはないだろうか?

私にもまったく違いがわからなかった。。

if文とswitch文やっていること一緒じゃね?と思ったので、先輩エンジニアに聞いてみた。

聞いた話によると

「if文は、全ての分岐を総当たりして、swtich文はswitchの一行を読んでから直接該当する条件にアクセスするからswitchの方がいい!」

とのこと。

検証してみた!


検証

とりあえず、if文とswitch文それぞれ同じ処理を10000回実行してみる。


if

console.time('timer');

var i;
var name = 'Taro';

for (i = 0; i < 10000; i++){
if (name === 'Mike') {
console.log("私は、マイクです。");
} else if (name === 'Taro') {
console.log("私は、太郎です。");
} else {
console.log("私は、"+ name + "です。");
}
}
console.timeEnd('timer');



switch

console.time('timer');

var i;
var name = 'Taro';

for (i = 0; i < 10000; i++){
switch(name) {
case 'Mike':
console.log("私は、マイクです。");
break;
case 'Taro':
console.log("私は、太郎です。");
break;
default:
console.log("私は、"+ name + "です。");
}
}
console.timeEnd('timer');


条件文
処理結果

if
98.288ms

switch
101.647ms

おい!いきなり予想を裏切ってきた!

この時点で、if文の勝ち確定orz


別の方法でも検証してみた

調べているうちにswitch文でも比較演算子が使えるswitch(true)というものがあるらしいので、そっちでも検証してみた!


if

console.time('timer1');

var i;
var age = 20;

for (i = 0; i < 10000; i++){
if (age <= 10) {
console.log("私は、10歳以下です。");
} else if (age <= 20) {
console.log("私は、20歳以下です。");
} else {
console.log("私は、21歳以上です。");
}
}
console.timeEnd('timer1');



switch

console.time('timer1');

var i;
var age = 20;

for (i = 0; i < 10000; i++){
switch(true) {
case age <= 10:
console.log("私は、10歳以下です。");
break;
case age <= 20:
console.log("私は、20歳以下です。");
break;
default:
console.log("私は、21歳以上です。");
}
}
console.timeEnd('timer1');


条件文
処理結果

if
91.201ms

switch
116.116ms

おいおい。。。

普通にif文の方が早いやん。


まとめ

一応、switch文の名誉挽回のために書いておく。


switch文のメリット


  • 可読性が高い

  • 特にエンタープライズなどの業務的に決まった値の場合、こういう処理しますという時に適している


switch文のデメリット


  • 処理の回数が多いと、速度に影響が出る

  • 複数条件に対応しづらい

  • 三項演算子が使えない

まぁ、おとなしくif文使っておけってことでした!


追加検証

「比較条件100個あって100番目にヒットする場合比較結果どうなる?」というコメントをいただいので、手で書いてやってみました。笑(こういう単純なプログラム一瞬で省略できるようになりたい。)


if

console.time('timer');

var i;
var count = 100;

for (i = 0; i < 10000; i++){
if (count === 1) {
console.log("");
} else if (count === 2) {
console.log("");
} else if (count === 3) {
console.log("");
} else if (count === 4) {
console.log("");
} else if (count === 5) {
console.log("");
} else if (count === 6) {
console.log("");
} else if (count === 7) {
console.log("");
} else if (count === 8) {
console.log("");
} else if (count === 9) {
console.log("");
} else if (count === 10) {
console.log("");
} else if (count === 11) {
console.log("");
} else if (count === 12) {
console.log("");
} else if (count === 13) {
console.log("");
} else if (count === 14) {
console.log("");
} else if (count === 15) {
console.log("");
} else if (count === 16) {
console.log("");
} else if (count === 17) {
console.log("");
} else if (count === 18) {
console.log("");
} else if (count === 19) {
console.log("");
} else if (count === 20) {
console.log("");
} else if (count === 21) {
console.log("");
} else if (count === 22) {
console.log("");
} else if (count === 23) {
console.log("");
} else if (count === 24) {
console.log("");
} else if (count === 25) {
console.log("");
} else if (count === 26) {
console.log("");
} else if (count === 27) {
console.log("");
} else if (count === 28) {
console.log("");
} else if (count === 29) {
console.log("");
} else if (count === 30) {
console.log("");
} else if (count === 31) {
console.log("");
} else if (count === 32) {
console.log("");
} else if (count === 33) {
console.log("");
} else if (count === 34) {
console.log("");
} else if (count === 35) {
console.log("");
} else if (count === 36) {
console.log("");
} else if (count === 37) {
console.log("");
} else if (count === 38) {
console.log("");
} else if (count === 39) {
console.log("");
} else if (count === 40) {
console.log("");
} else if (count === 41) {
console.log("");
} else if (count === 42) {
console.log("");
} else if (count === 43) {
console.log("");
} else if (count === 44) {
console.log("");
} else if (count === 45) {
console.log("");
} else if (count === 46) {
console.log("");
} else if (count === 47) {
console.log("");
} else if (count === 48) {
console.log("");
} else if (count === 49) {
console.log("");
} else if (count === 50) {
console.log("");
} else if (count === 51) {
console.log("");
} else if (count === 52) {
console.log("");
} else if (count === 53) {
console.log("");
} else if (count === 54) {
console.log("");
} else if (count === 55) {
console.log("");
} else if (count === 56) {
console.log("");
} else if (count === 57) {
console.log("");
} else if (count === 58) {
console.log("");
} else if (count === 59) {
console.log("");
} else if (count === 60) {
console.log("");
} else if (count === 61) {
console.log("");
} else if (count === 62) {
console.log("");
} else if (count === 63) {
console.log("");
} else if (count === 64) {
console.log("");
} else if (count === 65) {
console.log("");
} else if (count === 66) {
console.log("");
} else if (count === 67) {
console.log("");
} else if (count === 68) {
console.log("");
} else if (count === 69) {
console.log("");
} else if (count === 70) {
console.log("");
} else if (count === 71) {
console.log("");
} else if (count === 72) {
console.log("");
} else if (count === 73) {
console.log("");
} else if (count === 74) {
console.log("");
} else if (count === 75) {
console.log("");
} else if (count === 76) {
console.log("");
} else if (count === 77) {
console.log("");
} else if (count === 78) {
console.log("");
} else if (count === 79) {
console.log("");
} else if (count === 80) {
console.log("");
} else if (count === 81) {
console.log("");
} else if (count === 82) {
console.log("");
} else if (count === 83) {
console.log("");
} else if (count === 84) {
console.log("");
} else if (count === 85) {
console.log("");
} else if (count === 86) {
console.log("");
} else if (count === 87) {
console.log("");
} else if (count === 88) {
console.log("");
} else if (count === 89) {
console.log("");
} else if (count === 90) {
console.log("");
} else if (count === 91) {
console.log("");
} else if (count === 92) {
console.log("");
} else if (count === 93) {
console.log("");
} else if (count === 94) {
console.log("");
} else if (count === 95) {
console.log("");
} else if (count === 96) {
console.log("");
} else if (count === 97) {
console.log("");
} else if (count === 98) {
console.log("");
} else if (count === 99) {
console.log("");
} else if (count === 100) {
console.log("");
} else {
console.log("");
}
}
console.timeEnd('timer');



switch

console.time('timer');

var i;
var count = 100;

for (i = 0; i < 10000; i++){
switch (count) {
case 1:
console.log("");
break;
case 2:
console.log("");
break;
case 3:
console.log("");
break;
case 4:
console.log("");
break;
case 5:
console.log("");
break;
case 6:
console.log("");
break;
case 7:
console.log("");
break;
case 8:
console.log("");
break;
case 9:
console.log("");
break;
case 10:
console.log("");
break;
case 11:
console.log("");
break;
case 12:
console.log("");
break;
case 13:
console.log("");
break;
case 14:
console.log("");
break;
case 15:
console.log("");
break;
case 16:
console.log("");
break;
case 17:
console.log("");
break;
case 18:
console.log("");
break;
case 19:
console.log("");
break;
case 20:
console.log("");
break;
case 21:
console.log("");
break;
case 22:
console.log("");
break;
case 23:
console.log("");
break;
case 24:
console.log("");
break;
case 25:
console.log("");
break;
case 26:
console.log("");
break;
case 27:
console.log("");
break;
case 28:
console.log("");
break;
case 29:
console.log("");
break;
case 30:
console.log("");
break;
case 31:
console.log("");
break;
case 32:
console.log("");
break;
case 33:
console.log("");
break;
case 34:
console.log("");
break;
case 35:
console.log("");
break;
case 36:
console.log("");
break;
case 37:
console.log("");
break;
case 38:
console.log("");
break;
case 39:
console.log("");
break;
case 40:
console.log("");
break;
case 41:
console.log("");
break;
case 42:
console.log("");
break;
case 43:
console.log("");
break;
case 44:
console.log("");
break;
case 45:
console.log("");
break;
case 46:
console.log("");
break;
case 47:
console.log("");
break;
case 48:
console.log("");
break;
case 49:
console.log("");
break;
case 50:
console.log("");
break;
case 51:
console.log("");
break;
case 52:
console.log("");
break;
case 53:
console.log("");
break;
case 54:
console.log("");
break;
case 55:
console.log("");
break;
case 56:
console.log("");
break;
case 57:
console.log("");
break;
case 58:
console.log("");
break;
case 59:
console.log("");
break;
case 60:
console.log("");
break;
case 61:
console.log("");
break;
case 62:
console.log("");
break;
case 63:
console.log("");
break;
case 64:
console.log("");
break;
case 65:
console.log("");
break;
case 66:
console.log("");
break;
case 67:
console.log("");
break;
case 68:
console.log("");
break;
case 69:
console.log("");
break;
case 70:
console.log("");
break;
case 71:
console.log("");
break;
case 72:
console.log("");
break;
case 73:
console.log("");
break;
case 74:
console.log("");
break;
case 75:
console.log("");
break;
case 76:
console.log("");
break;
case 77:
console.log("");
break;
case 78:
console.log("");
break;
case 79:
console.log("");
break;
case 80:
console.log("");
break;
case 81:
console.log("");
break;
case 82:
console.log("");
break;
case 83:
console.log("");
break;
case 84:
console.log("");
break;
case 85:
console.log("");
break;
case 86:
console.log("");
break;
case 87:
console.log("");
break;
case 88:
console.log("");
break;
case 89:
console.log("");
break;
case 90:
console.log("");
break;
case 91:
console.log("");
break;
case 92:
console.log("");
break;
case 93:
console.log("");
break;
case 94:
console.log("");
break;
case 95:
console.log("");
break;
case 96:
console.log("");
break;
case 97:
console.log("");
break;
case 98:
console.log("");
break;
case 99:
console.log("");
break;
case 100:
console.log("");
break;
default:
console.log("");
}
}
console.timeEnd('timer');


気になる結果は・・・

条件文
処理結果

if
75.760ms

switch
29389.726ms

えっ。。。こんなに差がでるんですね。

if文が記事の上の方で書いたやつより早いのはconsole.logの中身が空だからだと思います。