JavaScript switch文のサンプル

JavaScriptのswitch文のサンプルです。条件で処理を分岐する時に使用します。

目次	switch文とは
	switch文のサンプル
	breakがない場合(フォールスルー)
	switch文の中でif文を使用する

switch文とは

switch(式){
　　case 値 :
　　　処理
　　　 break;
・・・
　　default:
　　　処理
　　　 break;
}

式の結果とcaseの値が一致すれば、配下の処理が実行されます。
比較は、===演算子で行うので値と型が一致する必要があります。
→数値型と文字列型の比較では一致しません。
breakでswitch文を抜けます。breakがないと下の判定(case/default)に行ってしまいます。
defaultは、条件の値がどのcaseの値にも一致しない時に実行されます。省略可能ですが書いたほうが良いです。
以下はMDNのswitch文のリンクです。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/switch

switch文のサンプル

<script>
    const a = "2";

    switch (a) {
        case "1":
            console.log("1つめ");
            break;
        case "2":
            console.log("2つめ"); // 2つめが出力される
            break;
        default:
            console.log("3つめ");
            break;
    }
</script>

2行目は、変数aに値をセットしています。
4行目からswitch文が始まります。
8行目のcase "2"は変数aの値と一致するのでその配下の処理が実行されます。
9行目の処理が実行されます。
10行目のbreakでswitch文を抜けます。

breakがない場合(フォールスルー)

<script>
    const a = "1";

    switch (a) {
        case "1":
            console.log("1つめ"); // 1つめが出力される

        case "2":
            console.log("2つめ"); // 2つめが出力される
            break;
        default:
            console.log("3つめ");
            break;
    }
</script>

7行目は、breakがありません。
5行目のcase "1"の処理の後、8行目のcase"2"の処理も実行されます。
フォールスルー(fall through/落ちる)と呼ばれます。
breakを書き忘れたのかわかりづらいので使用しないほうが良いです。

switch文の中でif文を使用する

<script>
    const a = 3;

    switch (a) {
        case 3:
            if (a % 2 == 0) {
                console.log("偶数");
            } else {
                console.log("奇数"); // 奇数が出力される
            }
            break;
        default:
            console.log("その他");
            break;
    }
</script>

6行目はswitch文の中のcaseの後にif文を使用しています。
%は、割り算の余りを求めます。