Java Script は、次のさまざまな形式の条件判断ステートメントをサポートしています。
- if ステートメント;
- if else ステートメント;
- if else if else ステートメント;
- switch case ステートメント。
このセクションでは、主に if、if else、if else if else ステートメントの使用方法を紹介します。switch case ステートメントについては、次のセクションで詳しく紹介します。
if ステートメント
if 文は JavaScript における最も単純な条件判定文であり、その構文形式は次のとおりです。
if(条件式){
// 実行するコード;
}
条件式が true の場合、つまり結果がブール値 true の場合、 { }
内のコードが実行されます。
サンプルコードは次のとおりです。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
</head>
<body>
<script type="text/javascript">
var age = 20;
if(age >= 18){ // もし age >= 18 がtrueの場合、{ }内のコードを実行する。
alert("大人です。");
}
</script>
</body>
</html>
実行結果を次の図に示します。
if else ステートメント
if else 文は if 文のバージョンアップであり、式が true のときに実行するコードを指定するだけでなく、式が true でないときに実行するコードも指定できます。構文形式は次のとおりです。 :
if(条件式){
// 式が true の場合に実行するコード
} else {
// 式が false の場合に実行するコード
}
サンプルコードは次のとおりです。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
</head>
<body>
<script type="text/javascript">
var now = new Date(); // 現在の完全な日付を取得する
var dayOfWeek = now.getDay(); // 0から6の数字を取得して、今日が週の何日目かを表す。0は日曜日、1は月曜日、と以降になる
if (dayOfWeek > 0 && dayOfWeek < 6) { // 条件分岐:もし今日が月曜日から金曜日の場合、「Have a nice day!」というアラートメッセージを表示させる。そうでなければ、「Have a nice weekend!」と表示させる。
alert("Have a nice day!");
} else {
alert("Have a nice weekend!");
}
</script>
</body>
</html>
実行結果を次の図に示します。
if ステートメントと if else ステートメントには条件式が 1 つだけあり、if else if else ステートメントはより高度な形式であり、if else if else ステートメントで複数の条件式を定義し、結果に従って対応する条件式を実行できます。式のコード、構文形式は次のとおりです。
if (条件式1) {
// 条件式1が真の場合に実行するコード
} else if (条件式2) {
// 条件式2がtrueの場合に実行するコード
}
…
else if (条件式N) {
// 条件式 N が true の場合に実行するコード
} それ以外 {
// すべての条件式が false の場合に実行するコード
}
ヒント: if else if else ステートメントの実行中に、有効な条件式が見つかると、後続の{ }
内のコードが直ちに実行され、その後、if else if else ステートメント全体が終了します。後続のコードの条件式に式が含まれている場合、実行されません。
サンプルコードは次のとおりです。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>JavaScript</title>
</head>
<body>
<script type="text/javascript">
var now = new Date(); // 現在の完全な日付を取得する
var dayOfWeek = now.getDay(); // 0-6の数字を取得して、今日が何曜日かを表す。0は日曜日、1は月曜日、以下同様
if(dayOfWeek == 0) { // 今日が何曜日か判断する
alert("日曜日")
} else if(dayOfWeek == 1) {
alert("月曜日")
} else if(dayOfWeek == 2) {
alert("火曜日")
} else if(dayOfWeek == 3) {
alert("水曜日")
} else if(dayOfWeek == 4) {
alert("木曜日")
} else if(dayOfWeek == 5) {
alert("金曜日")
} else {
alert("土曜日")
}
</script>
</body>
</html>
実行結果を次の図に示します。
予防
ネストされた if else を使用する場合、ステートメントが 1 行しかない場合は、条件の曖昧さを避けるために中括弧で囲む必要があります。
たとえば、次の if else のネストは誤解を招きます。
if(0)
if(1)
console.log(1);
else
console.log(0);
上記のコードの場合、JavaScript インタプリタは近接性の原理に従って次の論理レベルに従ってコードを解釈します。
もし(0)
もし(1)
console.log(1);
でなければ
console.log(0);
したがって、中括弧を使用すると、多くの問題を回避できます。
if(0){
if(1) console.log(1);
}else{
console.log(0);
}
もし(0){
もし(1)console.log(1);
}それ以外の場合{
console.log(0);
}