JavaScript における「ループ（繰り返し）」と「反復処理（イテレーション）」の概念を、MDN の “Loops and iteration” の内容を元に、初心者向けにかみくだいて説明します。まず、ざっと全体像、そのあと各種類（for、while、do…while、for…in、for…of、break／continue、ラベル付き文など）を順に見ていきます。
1. ループ／反復処理とは何か？
- プログラムで「何かを繰り返し実行する」必要があるときに使う仕組みが ループ（loop） や 反復（iteration） です。
- 例：配列の全要素を足し算する、1〜10 の数を順に表示する、など。
- ループを使うと「同じ処理を何度も書かなくて済む」ので、コードがすっきりします。
ただし、ループには「いつ終了するか」を制御する必要があります。もし終了条件がうまくないと、永久に繰り返してしまう（無限ループ）ことになります。
2. for 文
もっともよく使われるループの形式が for 文です。構文は以下のようになります。
for (初期化式; 条件式; 更新式) {
繰り返したい処理
}
動きは次のようになります：
- 初期化式 が最初に一度実行される（変数の初期化など）
- 条件式 をチェックする → 真 (true) ならループ本体を実行、偽 (false) ならループ終了
- ループ本体の処理を行う
- 更新式 を実行 （通常はカウンタを増やす／減らす）
- 再び条件式をチェック → 繰り返すかどうか判定
- 条件式が偽になるとループを抜けて次のコードへ進む
例
for (let i = 0; i < 5; i++) {
console.log(i);
}
この例では、 i を 0 から始めて、 i < 5 の間ループし、ループのたびに i++（i を 1 ずつ増やす） を実行します。結果として 0, 1, 2, 3, 4 が順番に出力されます。
for 文は、繰り返す回数があらかじめわかっているときに便利です。
3. while 文
while は、「条件を満たす限り処理を繰り返す」ループです。
構文は：
while (条件式) {
繰り返したい処理
}
処理される順序は：
- 先に条件式を評価する
- 条件式が真であればループ内部を実行、偽ならループを抜ける
例
let n = 0;
while (n < 3) {
console.log(n);
n++;
}
この例では、 n が 0, 1, 2 のときループが回ります。 n が 3 になると条件式 n < 3 は偽になるのでループが終了します。
注意点：ループ内で n++ のような更新をしないと、条件がずっと真のままになり、無限ループになってしまいます。
4. do…while 文
do…while は、少なくとも 1 回はループ本体の処理を実行したい場合に使います。
構文：
do {
繰り返したい処理
} while (条件式);
動作：
- 最初にループ本体を実行
- そのあと条件式をチェック
- 条件が真ならまたループ本体 → 条件が偽なら終了
つまり、条件式チェックが後置されているため、必ず一回は処理されます。
例
let i = 0;
do {
console.log(i);
i++;
} while (i < 3);
この例では、0, 1, 2 が出力されます。
5. break と continue
ループ中で条件に応じて「途中で抜けたい」「次の反復に飛びたい」ことがあります。そんなときに使うのが break と continue です。
break
breakを実行すると、そのループを 完全に抜ける（中断する）for、while、do…while、switch、ラベル付き文などを抜けられる
例：
for (let i = 0; i < 10; i++) {
if (i === 3) {
break;
}
console.log(i);
}
// 出力: 0, 1, 2
i が 3 になったら break でループを抜けて次の処理に移ります。
continue
continueを実行すると、その反復（ループの現在の回） の残り処理をスキップし、次の反復へ進む- ループ自体は終了せず、次のループに移る
例：
for (let i = 0; i < 5; i++) {
if (i === 2) {
continue;
}
console.log(i);
}
// 出力: 0, 1, 3, 4
i === 2 のときは continue によって console.log(i) がスキップされ、その後は通常通りループが続きます。
6. ラベル付き文（labeled statements）
これは少し上級の使い方ですが、入れ子になったループを制御したりするときに役立ちます。
構文：
ラベル名:
文
たとえば：
outer: for (let i = 0; i < 3; i++) {
for (let j = 0; j < 3; j++) {
if (i === 1 && j === 1) {
break outer; // “outer” ラベルのついたループを抜ける
}
console.log(i, j);
}
}
この例では、 i=1, j=1 のときに内側のループからだけでなく、外側のループまで一気に抜けることができます。
また、 continue ラベル名; を使って特定のループの次の反復に飛ばすこともできます。
ただし、ラベル付き文はコードが複雑になりやすいので、使う際は注意が必要です。
7. for…in と for…of
オブジェクトや配列（反復可能なもの）に対してループを行うときの、ややモダンな方法です。
for…in
objectの 列挙可能なプロパティ名（キー） に対して反復処理を行う- 構文：
for (let key in obj) {
// key は obj のプロパティ名（文字列）
console.log(key, obj[key]);
}
例：
const person = { name: "Alice", age: 30 };
for (let prop in person) {
console.log(prop, person[prop]);
}
// 出力例:
// "name" "Alice"
// "age" 30
注意点：配列に対して for…in を使うと、「インデックス」だけでなく「追加したプロパティ名」も列挙されることがあります。たとえば、配列にユーザー定義のプロパティを追加していた場合、それも列挙されます。
そのため、配列の要素を列挙したいときは for…in よりも別の方法を使うことが多いです。
for…of
- 反復可能オブジェクト（配列、
Map、Set、文字列、arguments、など）に対して、値 を順に取得しながらループを行う - 構文：
for (let value of iterable) {
console.log(value);
}
例：
const arr = [10, 20, 30];
for (let val of arr) {
console.log(val);
}
// 出力: 10, 20, 30
また、オブジェクトのキーと値を同時に扱いたいときは、 Object.entries(obj) を使って [key, value] の組を反復することもできます：
const obj = { foo: 1, bar: 2 };
for (const [key, val] of Object.entries(obj)) {
console.log(key, val);
}
// 出力:
// "foo" 1
// "bar" 2
for…of は値を扱いたいときに自然で使いやすいため、よく利用されます。
8. まとめ（使い分け・注意点）
| ループ形式 | 用途・特徴 | 注意・使いどころ |
|---|---|---|
for | 繰り返す回数があらかじめ分かっているとき | 初期化・条件・更新を適切に書く必要あり |
while | 条件を満たす限り繰り返したいとき | ループ内で条件を変える操作を忘れないように |
do…while | 少なくとも一度は処理を実行したいとき | 条件チェックが後なので注意 |
break / continue | 途中で抜けたい、スキップしたいとき | 使いすぎるとコードがわかりにくくなる |
| ラベル付き文 | 入れ子のループを柔軟に制御したいとき | 可読性を損なうことがあるので慎重に使う |
for…in | オブジェクトのプロパティを列挙したいとき | 配列・反復可能オブジェクトには注意が必要 |
for…of | 配列やその他の反復可能オブジェクトの値を扱いたいとき | 値を直接扱うならこちらが直感的 |
また、以下の点にも気をつけましょう：
- ループの中で条件が終わらない（条件を変えない）と無限ループになる
for…inとfor…ofの違いを理解して使い分ける- 複雑なネストやラベルがあると、あとで読み返すときに理解しにくくなるので、シンプルに書ける方法をまず試す