JavaScript 制御文 — if, switch
このトピックを終えると
if、else if、else を使って条件分岐を作成でき、switch をいつ使うか判断できるようになります。
条件に応じて異なる処理を実行
プログラムは常に同じ処理を行うわけではありません。「ログインしていればダッシュボードを表示し、そうでなければログインページを表示する」というように、処理を分岐させるのが条件文です。
javascript
const score = 85;
if (score >= 90) {
console.log("Aランク");
} else if (score >= 80) {
console.log("Bランク");
} else if (score >= 70) {
console.log("Cランク");
} else {
console.log("再試験");
}
// 出力: "Bランク"if の括弧内に条件を入れます。条件が true の場合、そのブロックが実行され、false の場合は次の else if または else に進みます。
比較演算子と論理演算子
条件文の中で値を比較するときに使用する記号です。
javascript
// 比較演算子
console.log(10 > 5); // true
console.log(10 === 10); // true (値と型が同じか)
console.log(10 == "10"); // true (値だけが同じか — 使用しないでください)
console.log(10 !== 5); // true (同じではないか)
// ⚠️ == の代わりに === を使用してください
// == は型を自動的に変換して比較するため、予期しない結果が発生する可能性があります
console.log(0 == false); // true (危険！)
console.log(0 === false); // false (正確！)javascript
// 論理演算子 — 条件を組み合わせる
const age = 25;
const hasTicket = true;
// AND: 両方が true の場合に true
if (age >= 18 && hasTicket) {
console.log("入場可能");
}
// OR: どちらか 1 つが true であれば true
if (age < 13 || age >= 65) {
console.log("割引適用");
}
// NOT: true と false を反転
if (!hasTicket) {
console.log("チケットを購入してください");
}== の代わりに === を使用することは、JavaScript の最も基本的なルールです。== は型を自動的に変換して比較するため、予測しにくい結果になる可能性があります。
switch — 1 つの値で複数の分岐
1 つの変数の値に応じて複数の分岐を行う場合は、switch を使用すると簡潔になります。
javascript
const day = "月";
switch (day) {
case "月":
case "火":
case "水":
case "木":
case "金":
console.log("平日");
break;
case "土":
case "日":
console.log("週末");
break;
default:
console.log("無効な入力");
}break を省略すると、次の case まで処理が実行されます (フォールスルー)。意図的に使用することもできますが、ほとんどの場合はミスです。break を省略していないか確認する習慣を身につけましょう。