条件分岐
JavaScriptは、条件によって処理を分岐させることができます。
本ページでは、条件分岐について説明します。
条件分岐とは
条件分岐とは、条件によって異なる処理をさせることです。

例えば、数字の合計が10の時だけ「おめでとう」と表示して、それ以外では「残念」と表示することができます。
また、条件を追加して合計が9の時は「惜しい」と表示したりもできます。
次からは、条件分岐を行うif文、switch文、条件演算子の構文や使い方を説明します。利用例を示す時にx、y、zを変数として使っていますが、事前に宣言されているものとします。
if文
if文は、条件と処理を記述して実行させます。構文は、以下のとおりです。
if ( 条件式 ) { 条件式がtrueの時の処理 } else { 条件式がfalseの時の処理 }
条件式は、例えばx + y === 10などと記述します。xとyの合計が10であればtrueが返されて、「条件式がtrueの時の処理」が実行されます。
xとyの合計が10でなければfalseが返されて、「条件式がfalseの時の処理」が実行されます。
つまり、trueの時とfalseの時で処理が分岐します。
条件式は、xなど変数だけ記述することもできます。let x = 2などと値が代入されていた場合は、trueになります。let xで宣言して値が代入されていない場合は、falseになります。
次からは、if文の利用例を示します。
if文の簡単な利用例
以下は、xとyの合計が10だったら、zに「おめでとう」を代入させる例です。
if ( x + y === 10 ) { z = "おめでとう"; }
このように、elseがなくてもif文は使えます。
次は、elseも利用する例です。
if ( x + y === 10 ) { z = "おめでとう"; } else { z = "残念"; }
xとyの合計が10でない場合は、zが「残念」になります。
else if
条件式がfalseの場合、さらに条件式を追加して処理をすることができます。
if ( x + y === 10 ) { z = "おめでとう"; } else if ( x + y === 9 ) { z = "惜しい"; } else { z = "残念"; }
xとyの合計が9の場合は、zが「惜しい」になります。else ifは、xとyの合計が10以外の時だけ処理されます。
ネスト(入れ子)
if文は、ネストできます。
if ( x === 1 ) { if ( x + y === 10 ) { z = "おめでとう"; } else if ( x + y === 9 ) { z = "惜しい"; } else { z = "残念"; } } else { z = "残念"; }
上記は、xが1でxとyの合計が10の時に、zが「おめでとう」になります。xが1でx + yが9の時は、zが「惜しい」になります。それ以外では、「残念」になります。
switch文
if文はtrueかfalseで分岐しますが、switch文は複数のパターンに分岐させることができます。構文は、以下のとおりです。
swicth ( 式 ) { case 値1: 値1の時の処理 break; case 値2: 値2の時の処理 break; default: その他の処理 }
式は、例えばx + yなどと記述します。
caseに続く値は、10など数字や"りんご"などの文字列です。文字列の場合は、ダブルクォーテーション(")かシングルクォーテーション(')で囲む必要があります。式の結果がこの値に一致すると、すぐ下の処理が実行されます。
breakは、switch文を抜けることを意味します。これがない場合、後続の処理が継続されます(例えば、値1の処理の後に値2などの処理も行われます)。
defaultは、値が一致しなかった時の処理です。
次からは、switch文の利用例を示します。
switch文の簡単な利用例
以下は、switch文の簡単な利用例です。
switch ( x + y ) { case 10: z = "おめでとう"; break; case 9: z = "惜しい"; break; default: z = "残念"; }
上記は、xとyの合計が10だったら、zに「おめでとう」、9の時は「惜しい」、それ以外では「残念」を代入します。
複数の値で同じ処理をさせる
以下は、複数の値で同じ処理ができます。
switch ( x ) { case "いちご": case "りんご": case "みかん": z = "くだもの"; break; case "サバ": case "イワシ": case "ハマチ": z = "さかな"; }
上記は、xが"いちご"、"りんご"、"みかん"だった場合、zに「くだもの」が代入されます。途中にbreakがないためです。
xが"サバ"、"イワシ"、"ハマチ"の場合は、zに「さかな」が代入されます。
defaultがないため、xがその他の値の場合は処理が行われません。
条件演算子
条件演算子(または三項演算子)は、値がtrueかfalseで処理を分けることができます。構文は、以下のとおりです。
( 条件式 ) ? 条件式がtrueの時の処理 : 条件式がfalseの時の処理
次からは、条件演算子の利用例を示します。
条件演算子の簡単な利用例
以下は、条件演算子の簡単な利用例です。
let z = ( x + y === 10 ) ? "おめでとう" : "残念";
上記は、xとyの合計が10の時はzが「おめでとう」になり、それ以外では「残念」になります。
これは、if文でも同じ条件分岐ができますが、複雑な分岐でない場合は条件演算子の方が記述が簡単です。
複数の条件演算子を使う
条件演算子は、以下のように複数使うこともできます。
let z = ( x + y === 10 ) ? "おめでとう" : ( x + y === 9 ) ? "惜しい" : "残念";
上記は、xとyの合計が10の時はzが「おめでとう」になり、9の時は「惜しい」、それ以外では「残念」になります。
if文のelse ifと同じような条件分岐になりますが、やはりこちらの方が記述が簡単です。