プログラミング言語JavaScriptのSwitch文について、JavaScript初心者向けに解説します。

Web開発経験のある筆者がJavaScriptのSwitch文の書き方や使い方、if文との違いについて丁寧に解説していきます。

ぜひ最後まで読んで、Switch文の基本を理解してください！

JavaScript switch~caseの書き方

条件分岐「もし～だったら～してほしい」といった処理では、if文、switch文が使えます。

今回はswitch文の書き方を見ていきましょう。

switch文の構文は以下の通りです。

この構文により、「もし、値Aだったとき、処理Aを実行しなさい。」

B,Cも同様、「もし、A〜Cに該当しない場合、デフォルトの処理を実行しなさい」が実現できます。

break・・・処理のループから抜けます。switch文,for文,while文などのループから強制的に抜けたい時に使用します。

意図的にbreak文を書かないフェイルスルーという処理もあります。

ただし、意図的にbreak文を書いていないのかわかりにくく、

エラーの温床となりやすいため、基本的にはbreak文を書くようにこころがけましょう。

default・・・どれにも該当しない場合に、実行します(defaultは、必ずしも最後に来る必要はありません。)

JavaScript switch~caseの具体例（string）

次のサンプルコード１は、英単語を翻訳するプログラムです。

指定された英単語と該当するものがあれば、翻訳した結果を返します。

変数「data」で文字列を受け取り、case句の値とマッチするものがあればその結果を返します。

dataで「banana」が指定され、出力に「バナナ」という翻訳結果がでています。

JavaScript switch~caseの具体例（int）

先ほどの例ではString(文字列)での例でしたが、それ以外に数値(int)も利用することができます。

それでは、サンプルコード2を見てみましょう。

次のサンプルコード2では、受け取ったdataの数値によって、

何等賞の当りか、ハズレかを判定しています。

「1のとき一等賞」「2のとき二等賞」「3のとき三等賞」「それ以外のとき、ハズレ」 となります。

今回指定された4の数字は、case1〜3のどれにも当てはまりませんので、

default部分が実行されています。

この様に、数字の値によって出力を変更することができました。

JavaScript switch~caseとif文の使い分けとは？

if文でも条件分岐ができますが、使い分けのポイントについて考えてみましょう。

switch~caseとif文の使い分けのポイント

• 単純な２分岐であればifを使う
• 3分岐以上であればswitchを使う

switch文を使うことで嬉しいことといえば、

分岐が多い処理になったとしてもコードが見やすくメンテンスがしやすいということです。

if〜else文が多くなってしまって管理しにくい場合は,switch文で書けるかを検討したほうが良いでしょう。

また、実行速度という点では、多分岐の場合は、switchのほうが早いとされています。

エンジニアに役立つ目的別講座

Pythonの基本～応用をマスター

Webサイトのコーディングができるように

AWSを基礎から学ぶ

オリジナルのウェブサイトを作ろう