JavaScriptの条件文について

JavaScriptの条件文は、プログラムの流れを制御し、異なる条件に応じて異なる動作を実行するための基本的な構造です。

条件文を理解することで、コードの柔軟性と応答性を高めることができます。

本記事では、if文、else文、else if文、switch文といった主要な条件文の使い方を詳しく解説します。

条件文をマスターすることで、より直感的で管理しやすいコードを書くスキルを向上させ、プログラムの品質を高めることができます。

それでは、条件文の世界へ一歩踏み出していきましょう。

タップできる目次

JavaScriptの条件文
まとめ

JavaScriptの条件文

if文

if文は、条件が真の場合にのみ特定のコードブロックを実行するための構文です。

これにより、プログラムの流れを制御し、特定の状況に応じて異なる動作を実現することができます。

if (条件式) {
  // 条件式が真の場合に実行されるコード
}
let age = 20;

if (age >= 18) {
    console.log("あなたは成人です。");
}

上記の例では、age が18以上の場合に「あなたは成人です。」というメッセージが表示されます。

ネストされたif文

if文の内部にさらにif文を含めることができます。これをネストされたif文と呼びます。

let age = 20;
let isStudent = true;

if (age >= 18) {
    if (isStudent) {
        console.log("あなたは成人の学生です。");
    } else {
        console.log("あなたは成人です。");
    }
} else {
    console.log("あなたは未成年です。");
}

上記の例では、age が18以上で isStudent が真の場合には「あなたは成人の学生です。」と表示され、isStudent が偽の場合には「あなたは成人です。」と表示されます。

else文

if文に続けて else文を使用すると、条件が偽の場合に実行されるコードブロックを指定できます。

if (条件式) {
    // 条件式が真の場合に実行されるコード
} else {
    // 条件式が偽の場合に実行されるコード
}
let age = 16;

if (age >= 18) {
    console.log("あなたは成人です。");
} else {
    console.log("あなたは未成年です。");
}

上記の例では、age が18未満の場合に「あなたは未成年です。」というメッセージが表示されます。

else if文

複数の条件を評価する場合には、else if文を使用できます。

else if文を使用することで、最初の条件が偽の場合に次の条件を評価し、それが真の場合に対応するコードブロックを実行します。

if (条件式1) {
    // 条件式1が真の場合に実行されるコード
} else if (条件式2) {
    // 条件式2が真の場合に実行されるコード
} else {
    // すべての条件が偽の場合に実行されるコード
}
/

let score = 75;

if (score >= 90) {
    console.log("成績はAです。");
} else if (score >= 80) {
    console.log("成績はBです。");
} else if (score >= 70) {
    console.log("成績はCです。");
} else {
    console.log("成績はDです。");
}

上記の例では、score が90以上の場合には「成績はAです。」、80以上の場合には「成績はBです。」、70以上の場合には「成績はCです。」、それ以外の場合には「成績はDです。」と表示されます。

論理演算子とif文の組み合わせ

論理演算子を使うことで、if文で複雑な条件をチェックすることができます。

主な論理演算子にはAND（&&）、OR（||）、NOT（!）があります。

それぞれの演算子の使い方と、if文との組み合わせについて見ていきましょう。

AND（&&）演算子

AND演算子は、両方の条件が真（true）の場合にのみ全体が真（true）になります。

少なくとも一方が偽（false）の場合は、全体が偽（false）になります。

以下はユーザーが18歳以上で、かつ会員であるかを確認する場合の例です。

let age = 20;
let isMember = true;

if (age >= 18 && isMember) {
  console.log("ユーザーは18歳以上で会員です。");
} else {
  console.log("ユーザーは条件を満たしていません。");
}

OR（||）演算子

OR演算子は、少なくとも一方の条件が真（true）であれば全体が真（true）になります。両方が偽（false）の場合のみ全体が偽（false）になります。

以下はユーザーが18歳以上であるか、または会員であるかを確認する場合の例です。

let age = 16;
let isMember = true;

if (age >= 18 || isMember) {
  console.log("ユーザーは18歳以上であるか、または会員です。");
} else {
  console.log("ユーザーは条件を満たしていません。");
}

NOT（!）演算子

NOT演算子は、条件の真偽を反転させます。真（true）であれば偽（false）に、偽（false）であれば真（true）に変わります。

以下はユーザーが会員ではないことを確認する場合の例です。

let isMember = false;

if (!isMember) {
  console.log("ユーザーは会員ではありません。");
} else {
  console.log("ユーザーは会員です。");
}

論理演算子の組み合わせ

複数の論理演算子を組み合わせて、より複雑な条件をチェックすることができます。

以下はユーザーが18歳以上で会員であるか、または管理者であるかを確認する場合の例です。

let isMember = false;

if (!isMember) {
  console.log("ユーザーは会員ではありません。");
} else {
  console.log("ユーザーは会員です。");
}

この例では、ユーザーが18歳以上で会員であるか、または管理者であれば条件を満たしています。

三項演算子

三項演算子（条件演算子）は、簡潔な条件分岐を行うための演算子です。

if文を使って条件分岐を行う場合に比べて、1行で結果を得ることができるため、シンプルな条件分岐には非常に便利です。

条件式 ? 式1 : 式2

let age = 20;
let canVote = (age >= 18) ? "投票できます" : "投票できません";
console.log(canVote); // "投票できます"

三項演算子は、シンプルな条件分岐を行う場合に便利ですが、複雑なロジックや複数の条件を処理する場合にはif文の方が適しています。

let age = 20;let canVote; if (age >= 18) { canVote = "投票できます"; } else { canVote = "投票できません"; } console.log(canVote); // "投票できます"

三項演算子とif文のどちらを使用するかは、条件の複雑さやコードの可読性を考慮して選択することが重要です。

switch文

switch文は、複数の条件を効率的に評価し、条件に一致するケースに基づいてコードを実行するための構文です。

if-else文と同様の機能を持ちますが、複数の条件をチェックする場合にはswitch文の方が見やすくなります。

switch (式) {
case 値1:
// 式が値1に一致する場合に実行されるコード
break;
case 値2:
// 式が値2に一致する場合に実行されるコード
break;
// 必要なだけcaseを追加
default:
// すべてのcaseに一致しない場合に実行されるコード
}

let fruit = "apple";

switch (fruit) {
    case "apple":
        console.log("This is an apple.");
        break;
    case "banana":
        console.log("This is a banana.");
        break;
    case "orange":
        console.log("This is an orange.");
        break;
    default:
        console.log("Unknown fruit.");
}

上記の例では、変数 fruit の値が apple に一致するため、「This is an apple.」が表示されます。

break文は、条件が一致した後にswitch文を抜けるために使用されます。

defaultを使う場合

defaultケースは、すべてのcaseに一致しない場合に実行されるコードブロックです。

defaultケースはオプションですが、条件に一致しなかった場合の処理を行いたい場合に使用します。

let color = "purple";

switch (color) {
    case "red":
        console.log("Color is red.");
        break;
    case "blue":
        console.log("Color is blue.");
        break;
    case "green":
        console.log("Color is green.");
        break;
    default:
        console.log("Unknown color.");
}

この例では、変数 color の値がいずれのcaseにも一致しないため、「Unknown color.」が表示されます。

複数のケースをまとめる

同じコードを実行する複数のケースをまとめることもできます。

この場合、break文を使用するまで、すべての一致するケースが同じコードを実行します。

let day = "Saturday";

switch (day) {
    case "Saturday":
    case "Sunday":
        console.log("It's the weekend!");
        break;
    default:
        console.log("It's a weekday.");
}

この例では、day が “Saturday” または “Sunday” の場合に「It’s the weekend!」が表示されます。それ以外の日の場合は「It’s a weekday.」が表示されます。