先生と生徒の会話形式で理解しよう

生徒

「JavaScriptで同じ処理を条件が変わるまで繰り返したいときはどう書けばいいですか？」

先生

「そんなときに使うのがwhile文ですよ。条件がtrueである間、ずっとくり返す構文です。」

生徒

「条件って何ですか？難しそう…」

先生

「条件とは、『〇〇の間だけくり返す』という目安のことです。今回は初心者にもわかるように丁寧に解説しますね！」

1. while文とは？

while文は「〇〇の間だけ繰り返す」という条件があるループ処理です。for文と比べて、回数ではなく条件を重視します。例えば「お腹が空いている間だけ食べる」と同じイメージです。

2. while文の基本構文

JavaScriptのwhile文は次のように書きます。


while (条件) {
  // 条件がtrueの間、繰り返す処理
}

ここで、条件とは＜true＞か＜false＞を返す式（しき）のことです。たとえば「数字が10未満ならくり返す」というようなものです。

3. 実際にwhile文を使ってみよう

たとえば、「数字を0から順に足して、合計が10より小さい間くり返す」コードは次のようになります。


let sum = 0;
let num = 0;
while (sum < 10) {
  sum += num;
  console.log("合計：" + sum);
  num++;
}

実行すると、sumが10未満の間だけ繰り返され、数字がどんどん足されていきます。


合計：0
合計：1
合計：3
合計：6
合計：10

4. while文の各部分をわかりやすく解説

let sum = 0; → 合計を0に初期化
let num = 0; → 足す数字も0からスタート
while (sum < 10) → 「合計が10未満」の間だけくり返す
sum += num; → sum = sum + numと同じ意味で、合計に数字を足す
num++; → 数字を1ずつ増やす

このように条件に応じてループが止まるので、for文よりも柔軟に使えます。

5. do...while文とのちがい

似た構文にdo...while文があります。こちらは一度必ず中の処理を実行してから条件を確かめます。


let num2 = 0;
do {
  console.log("num2=" + num2);
  num2++;
} while (num2 < 1);


num2=0

違いは、while文は最初に条件をチェックして必要なければ一度も実行しない点にあります。

6. 無限ループに注意しよう

無限ループとは、条件がいつまでもtrueのままで終わらないループのことです。たとえば次のような書き方は永遠にくり返します。


let count = 0;
while (count < 3) {
  console.log(count);
  // count++ を忘れると無限ループになる
}

処理が止まらず、ブラウザが固まるので必ずcount++などの更新処理を入れましょう。

7. while文の使いどころ

while文は以下のような場面で役立ちます：

ユーザーの入力が正しいまでくり返す
データを条件付きで順に取り出す
条件がくり返す回数ではなく状況で決まるとき

たとえば「パスワードを正しく入力するまで繰り返す」といった処理に使えます。

8. 実際のコードにwhile文を使う例

たとえば、配列から条件に合う値が出るまで探し続けるような実用例は次のようです。


const nums = [3, 7, 2, 9, 5];
let idx = 0;
while (nums[idx] !== 9 && idx < nums.length) {
  console.log("調査中：" + nums[idx]);
  idx++;
}
console.log("見つかった値：" + nums[idx]);


調査中：3
調査中：7
調査中：2
調査中：9
見つかった値：9

このように、値が見つかるまでくり返す処理が簡単に書けます。

JavaScriptのwhile文の基本構文と使いどころを学ぼう