switch文 - hiro's note

swich文とは
swich文の書き方
swich文の注意点
default
1. ～if文を用いた条件分岐～
2. ～swich文を用いた条件分岐～

swich文とは

if文以外の条件分岐の方法としてswich文がある。

swich文は、ある値によって処理を分岐する場合に用いる。

例えば、信号（定数：color）で値が”緑”なら「進む」、値が”黄”なら「要注意」、値が”赤”なら「止まる」といった具合。

swich文の書き方

「switch (条件の値) {処理}」とすることでswitch文を書くことができる。

swicth( 条件の値 ) {
・　　　変数や定数など
・
・
} // セミコロンは不要

const color = "赤";
switch(color) {
・　　定数colorの値に応じて処理を分岐する
・
・
}

swich文の中にcaseを追加することで処理を分けることができる。
※breakについは後述。

switch(条件の値) {
  case 値１:
  「条件の値」が「値１」と等しい時の処理
    break;
}

const color = "赤";
switch(color) {
  case "赤":
    console.log("ストップ"); 定数colorの値が"赤"のときに実行される
    break;

}

swich文では分岐の数だけcaseを追加していく。

swich( 条件の値 ) {
  case 値１:
  「条件の値」が「値１」と等しい
    break;
  case 値２:
  「条件の値」が「値２」と等しい
    break;
}

const color = "赤";
switch(color) {
  case "赤":
    console.log("止まれ");  定数colorの値が"赤"のときに実行される
    break;
  case "黃":
    console.log("要注意");  定数colorの値が"黃"のときに実行される
    break;
}

swich文の注意点

swich文ではbreakが非常に重要となる。

breakとはswich文を終了する命令のこと。

breakがないと、合致したcaseの処理を行った後、その次のcaseの処理も実行してしまう。

そのため、swich文を使うときはbreakを忘れないように注意！

const color = "赤";
swicth(color) {
  case "赤":
    console.log("止まれ");  実行される
    // breakがないと･･･
  case "黃":
    console.log("要注意");  こちらも実行される
    break;
}

止まれ
要注意

default

caseのどれにも一致しなかったときは、defaultのブロックが実行される。

defaultはif分のelseに似たもの。

swich( 条件の値 ) {
  case 値１:
  　　・
  　　・
  　　・
  case 値２:
  　　・
  　　・
  　　・
  case 値３:
  　　・
  　　・
  　　・
  default:  「条件の値」が値１、値２、値３のどれとも異なるとき
    処理
    break;
}

const color = "黒";
swich(color) {
  case "赤":
  　　・
  　　・
  　　・
  case "赤":
  　　・
  　　・
  　　・
  case "赤":
  　　・
  　　・
  　　・
  default:
    console.log("colorの値が正しくありません");  この処理が実行される
    break;
}

このようなswich文の性質を利用すると、if、else ifによる分岐が多く複雑な場合でも、swich文に書き換えることでシンプルで読みやすいコードにできる。

～if文を用いた条件分岐～

if( 条件式１ ) {
  処理
} else if( 条件式２ ) {
  処理
} else {
  処理
}

～swich文を用いた条件分岐～

swich( 条件の値１ ) {
  case 値１:
    処理
    break;
  case 値２：
    処理
    break;
  case 値３：
    処理
    break;
}