JavaScriptの繰り返し処理:while文とfor文

条件分岐に続いて、「繰り返し処理」を学びました。同じ処理を何度も実行したいとき、繰り返し処理(ループ)を使うことでコードを劇的に短くできます。

while文:条件がtrueの間繰り返す

構文:

while (条件式) {
  処理
}
let count = 1;

while (count <= 3) {
  console.log(`${count}回目`);
  count += 1;
}
// 1回目
// 2回目
// 3回目

ポイント

  • 条件式を () で囲む
  • 処理を {} で囲む
  • セミコロンは不要while の後に ; は付けない)

条件式が true の間、{} 内の処理が繰り返されます。

無限ループに注意

while文で最も注意すべきは、無限ループです。

let count = 1;

// ❌ 無限ループの例
while (count <= 3) {
  console.log(`${count}回目`);
  // count += 1 を忘れると、countが永遠に1のまま
}
// 1回目
// 1回目
// 1回目
// ...(永遠に続く)

対策: ループ内で条件を変化させる処理(count += 1 など)を必ず書くこと。

for文:シンプルに書ける繰り返し処理

for文 は、while文と同じことができますが、よりシンプルに書ける特徴があります。

構文:

for (変数の定義; 条件式; 変数の更新) {
  処理
}
for (let i = 1; i <= 3; i += 1) {
  console.log(`${i}回目`);
}
// 1回目
// 2回目
// 3回目

for文の3つの要素

  1. 変数の定義: let i = 1(最初に1回だけ実行)
  2. 条件式: i <= 3(毎回チェック)
  3. 変数の更新: i += 1(毎回実行)

各要素はセミコロン ; で区切ります。ただし、文末のセミコロンは不要です。

while文とfor文の比較

同じ処理を、while文とfor文で比較してみます。

while文

let i = 1;  // 変数の定義

while (i <= 3) {  // 条件式
  console.log(`${i}回目`);
  i += 1;  // 変数の更新
}

for文

for (let i = 1; i <= 3; i += 1) {
  console.log(`${i}回目`);
}

for文の方が、変数の定義・条件式・更新が1行にまとまっていて読みやすいです。

インクリメントとデクリメント:計算式の省略

繰り返し処理では、変数を1ずつ増やしたり減らしたりすることが多いです。これをさらに省略して書けます。

インクリメント(1を足す)

// 通常の書き方
i = i + 1;

// 省略形1
i += 1;

// 省略形2(インクリメント演算子)
i++;

i++ は、i を1増やすという意味です。

デクリメント(1を引く)

// 通常の書き方
i = i - 1;

// 省略形1
i -= 1;

// 省略形2(デクリメント演算子)
i--;

i-- は、i を1減らすという意味です。

for文での使用例

// インクリメントを使った for文
for (let i = 1; i <= 3; i++) {
  console.log(`${i}回目`);
}

// デクリメントを使った for文(逆順)
for (let i = 3; i >= 1; i--) {
  console.log(`${i}回目`);
}
// 3回目
// 2回目
// 1回目

実務では、i++i-- の書き方が一般的です。

while文とfor文の使い分け

while文が適している場合

  • 繰り返し回数が不明
  • 条件だけで判定したい
// ユーザーが正しい入力をするまで繰り返す
let password = '';

while (password !== '1234') {
  password = prompt('パスワードを入力してください');
}

for文が適している場合

  • 繰り返し回数が決まっている
  • カウンタ変数を使う
// 1から10まで表示
for (let i = 1; i <= 10; i++) {
  console.log(i);
}

実務では、繰り返し回数が決まっている場合は for文を使うことが多いです。

Pythonとの比較

項目PythonJavaScript
while文の構文while 条件:while (条件) {}
for文の構文for i in range(3):for (let i = 0; i < 3; i++)
インクリメントi += 1i++ または i += 1
デクリメントi -= 1i-- または i -= 1

JavaScriptのfor文は、Pythonの range() よりも柔軟に書ける一方、最初は複雑に感じるかもしれません。

今日の学びのポイント

  • while文: while (条件式) { 処理 }
  • 無限ループに注意(条件を変化させる処理を必ず書く)
  • for文: for (変数の定義; 条件式; 変数の更新) { 処理 }
  • for文の要素はセミコロン ; で区切る(文末のセミコロンは不要)
  • インクリメント: i++(1を足す)
  • デクリメント: i--(1を引く)
  • 使い分け: 繰り返し回数が決まっている → for、不明 → while

繰り返し処理は、プログラミングの効率を劇的に上げる基本技術です。次は、複数のデータをまとめて扱う「配列」を学びます。

コメント