JavaScript switch文 まとめ

目的

• JavaScriptのswitch文について知る。

押さえるポイント

• 条件となる変数に入った値によって処理を分岐させるときに使う。
• caseを書いたら必ずbreakで処理を閉じる。
• 信号機を例として説明する。(説明のため実際の道路交通法とは異なります。) 下記のように「信号機の色」に対して「実施する処理」を分岐することができる。
  1. 信号機が赤の時は「とまれ」の処理
  2. 信号機が黄の時は「注意」の処理
  3. 信号機が青の時は「進め」の処理

書き方の例

• 信号機を用いてswitch文の例を記載する。

switch(信号の色){
  //「信号の色」に「赤色」が格納されているときに入る処理
  case 赤色:
    信号の色が赤色の時、すなわち車を止める処理;
    break;
  //「信号の色」に「黄色」が格納されているときに入る処理
  case 黄色:
    信号の色が黄色の時、すなわち車に注意を促す処理;
    break;
  //「信号の色」に「青色」が格納されているときに入る処理
  case 青色:
    信号の色が青色の時、すなわち車を進める処理;
    break;
  //「信号の色」に「赤色」「黄色」「青色」以外は格納されているときに入る処理
  default:
    信号の色が赤色、黄色、青色以外の時の処理;
    break;
}

より具体的な例

• 信号機の例をより詳しく説明する。
• 信号機の色の表す変数colorを定義、この変数には「red」「yellow」「blue」のいづれかが格納される。
• colorがredの時に「車は止まります」と出力する。
• colorがyellowの時に「車は注意します」と出力する。
• colorがblueの時に「車は進みます」と出力する。
• colorにそれ以外の値が入った時「信号機は故障しています。」と出力する。
• 上記の処理を下記に記す。

switch(color){
  //「color」に「red」が格納されているときに入る処理
  case red:
    console.log("車は止まります");
    break;
  //「color」に「yellow」が格納されているときに入る処理
  case yellow:
    console.log("車は注意します");
    break;
  //「color」に「blue」が格納されているときに入る処理
  case blue:
    sonsole.log("車は進みます");
    break;
  //「color」に「red」「yellow」「blue」以外が格納されているときに入る処理
  default:
    console.log("信号は故障しています");
    break
}