JavaScriptのwhile文とは?for文との違いを解説

JavaScriptでは、同じ処理を繰り返すために「繰り返し処理(ループ)」を使用します。
代表的な繰り返し構文には for文 や while文 などがあります。
その中でも while文 は「条件が満たされている間、処理を繰り返す」構文であり、シンプルなループ処理を実装する際に使用されます。
この記事では、
- while文の基本
- while文の書き方
- for文との違い
- while文を使うべき場面
について、初心者でも理解できるように解説します。
なお、JavaScriptの基本的な文法については、先に以下の記事を確認しておくと理解が深まります。
▶ 関連記事
[JavaScriptの基本と仕組みを理解する]
Contents
while文とは
while文とは、条件がtrueである間、処理を繰り返す構文です。
基本的な考え方は次の通りです。
条件がtrue → 処理を実行
条件がtrue → もう一度処理
条件がfalse → 繰り返し終了つまり、条件が成立している限り、同じ処理を何度も実行します。
while文の基本構文
while文の基本構文は以下の通りです。
while (条件式) {
繰り返し処理
}処理の流れは次の通りです。
- 条件式を評価する
- trueなら処理を実行
- 再び条件式を確認
- falseになるまで繰り返す
while文の基本例
簡単な例として、1〜5までの数字を表示するコードを見てみます。
let i = 1;
while (i <= 5) {
console.log(i);
i++;
}実行結果
1
2
3
4
5処理の流れ
- i = 1
- i <= 5 → true
- console.log(i) を実行
- i++ で数字を増やす
- 条件を再チェック
- i > 5 になったら終了
このように 条件が成立している間だけ処理が続きます。
無限ループに注意
while文では 条件が永遠にtrueになると無限ループ になります。
例
let i = 1;
while (i <= 5) {
console.log(i);
}このコードでは iが増えないため条件がずっとtrue になります。
結果として
1
1
1
1
1
1
...と処理が終わらなくなります。
そのため、while文では 条件がいつfalseになるのかを必ず設計することが重要です。
do…while文との違い
JavaScriptには do…while文 という似た構文もあります。
do…whileの構文
do {
処理
} while (条件);違いは 条件の判定タイミング です。
| 構文 | 特徴 |
|---|---|
| while | 最初に条件を確認 |
| do…while | 1回実行してから条件確認 |
例
let i = 10;
do {
console.log(i);
} while (i < 5);この場合、条件はfalseですが 1回だけ実行されます。
for文との違い
繰り返し処理では for文 と while文 の使い分けが重要です。
for文の基本については、以下の記事で詳しく解説しています。
▶ 関連記事
[JavaScriptの繰り返し処理(for文)とは?基本から解説]
for文の構文
for (初期化; 条件; 更新) {
処理
}例
for (let i = 1; i <= 5; i++) {
console.log(i);
}while文との違い
| 比較 | while文 | for文 |
|---|---|---|
| 構造 | シンプル | ループ用に最適化 |
| 用途 | 条件ベースのループ | 回数が決まったループ |
| 可読性 | やや低い場合あり | 読みやすい |
while文が向いている場面
while文は 繰り返し回数が決まっていない場合 に向いています。
例
- ユーザー入力が正しいまで繰り返す
- 条件を満たすまで処理を続ける
- 外部データを処理する
例
let input = "";
while (input !== "OK") {
input = prompt("OKと入力してください");
}このように 終了条件が不明確な処理 ではwhile文が適しています。
for文が向いている場面
for文は 回数が決まっているループ に適しています。
例
- 配列を処理する
- 指定回数の繰り返し
- カウンターループ
例
for (let i = 0; i < 10; i++) {
console.log(i);
}このように 回数が明確な場合はfor文が一般的です。
while文の実務での使用例
実際の開発では、while文は次のような場面で使われます。
データ処理ループ
let i = 0;
while (i < data.length) {
console.log(data[i]);
i++;
}条件成立までの処理
while (!isLoaded) {
checkStatus();
}このように 条件に応じて処理を続ける場面 で活用されます。
まとめ
while文は、JavaScriptの基本的な繰り返し構文のひとつです。
ポイントを整理します。
- while文は 条件がtrueの間処理を繰り返す
- 条件がfalseになると処理が終了
- 無限ループに注意する必要がある
- 回数が決まっている場合は for文
- 条件ベースの処理では while文
繰り返し処理はJavaScriptの基礎文法の中でも特に重要な要素です。
JavaScriptの基礎を体系的に理解するには、以下の記事もあわせて読むと理解が深まります。

