JavaScriptの制御構文（条件分岐、ループ処理等）を学ぶ【基本】

JavaScriptの制御構文をマスターして、効率的なコードを書けるようになりましょう！

本記事では、条件分岐やループ処理など、基本から応用まで網羅的に解説します。
初心者の方でも理解しやすいようにコード例を豊富に用意していますので、ぜひ参考にしてください。

条件分岐

条件分岐は、指定した条件が「真（true）」か「偽（false）」かによって、実行する処理を切り替える構文です。

if文

最も基本的な条件分岐で、条件が真の場合にのみ処理を実行します。

解説: ageが18以上であれば、「あなたは成人です。」と表示されます。

let age = 20;

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

if…else文

条件が偽の場合に別の処理を実行します。

解説: ageが18未満の場合、「あなたは未成年です。」と表示されます。

let age = 16;

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

else if文

複数の条件を順にチェックします。

解説: scoreが75なので、「評価：C」が表示されます。

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");
}

switch文

複数の条件を比較する場合に使用します。

解説: dayが3なので、「今日は水曜日です。」と表示されます。

let color = "red";

switch (color) {
  case "red":
    console.log("赤です");
    break;
  case "blue":
    console.log("青です");
    break;
  default:
    console.log("その他の色です");
}

繰り返し処理（ループ）

同じ処理を複数回行いたい場合に使用します。

for文

決まった回数の繰り返しに適しています。

解説: 1から5までの数字を使って、5回ループします。

for (let i = 1; i <= 5; i++) {
  console.log(`${i}回目のループです。`);
}

while文

条件が真である間、処理を繰り返します。

解説: iが5以下である限り、ループが続きます。

let i = 1;

while (i <= 5) {
  console.log(`${i}回目のループです。`);
  i++;
}

do…while文

最低1回は処理を実行します。

解説: doブロック内の処理が必ず一度は実行されます。

let i = 0;
do {
  console.log(`現在のカウントは${i}`);
  i++;
} while (i < 5);

for…in文

オブジェクトのプロパティをループします。

解説: studentオブジェクトの各プロパティ名と値を表示します。

let student = { name: "太郎", age: 18, grade: "A" };

for (let key in student) {
  console.log(`${key}: ${student[key]}`);
}

for…of文

反復可能なオブジェクトをループします。

解説: scores配列の各要素を順番に表示します。

let scores = [90, 80, 70];

for (let score of scores) {
  console.log(`得点: ${score}`);
}

制御構文のネスト

制御構文は入れ子にすることができます。

for (let i = 0; i < 3; i++) {
  if (i % 2 === 0) {
    console.log(`${i}は偶数です`);
  } else {
    console.log(`${i}は奇数です`);
  }
}

制御構文の応用

break文

ループを途中で終了します。

解説: iが5を超えた時点でループが終了します。

for (let i = 1; i <= 10; i++) {
  if (i > 5) {
    break;
  }
  console.log(i);
}

continue文

現在のループをスキップします。

解説: iが3のときだけ表示をスキップします。

for (let i = 0; i < 10; i++) {
  if (i % 2 === 0) {
    continue;
  }
  console.log(i);
}

エラーハンドリング

プログラム中でエラーが発生した場合に、それを適切に処理する方法です。

try…catch文

エラーが発生する可能性のあるコードをtryブロックに入れ、エラーが発生した場合はcatchブロックで処理します。

解説: riskyOperationが定義されていないため、エラーがキャッチされます。

try {
  undefinedFunction();
} catch (error) {
  console.log("エラーが発生しました: " + error.message);
}

throw文

意図的にエラーを発生させることができます。

解説: ageが負の値なので、エラーが投げられます。

function checkAge(age) {
  if (age < 0) {
    throw new Error("年齢は0以上でなければなりません。");
  }
  return "年齢は正しいです。";
}

try {
  let message = checkAge(-1);
  console.log(message);
} catch (error) {
  console.log("エラー: " + error.message);
}

まとめ

制御構文はプログラミングの基礎であり、これらを理解することで複雑なロジックを実装できるようになります。条件分岐やループ、エラーハンドリングを組み合わせて、効率的で信頼性の高いコードを書けるようになりましょう。