while でカウントダウン

生田 陸人
LuaGate エンジニア / 現役エンジニア
編集 LuaGate編集部

このレッスンで分かること

  • while (条件) { ... } は条件が true の間ブロックを繰り返します、初期化と更新は外に書きます
  • for と書き換え可能、回数固定なら for、終了タイミングが動的なら while
  • 最小例は let i = n; while (i >= 0) { result.push(i); i--; }

while でカウントダウン とは

条件が満たされている間だけ繰り返す while 文を学び、n から 0 まで降順の配列を作ってみよう。

while 文は「条件が続く間だけ」回るループ

前のレッスンでは for 文を学びました。for は「5 回繰り返したい」のように 回数があらかじめ決まっている ループに向いている構文でしたね。今度は「条件が満たされている間だけ繰り返す」という別の発想のループ、while 文を学びます。

JavaScript の繰り返し構文には主に for while do-while for-of for-in の 5 種類があります。for は回数決め打ちのループ、while は条件が続く間ずっと回るループ、と覚えると役割の違いがクリアになります。たとえば「ユーザーが正しい入力をするまで」「リストが空になるまで」のように、回数が事前に分からないループでは while のほうが自然です。

試しに、n から 0 までを降順に並べた配列を for で書くとこうなります。

JavaScript

function countdownFor(n) { const result = []; for (let i = n; i >= 0; i--) { result.push(i); } return result; }

これを while 文で書き換えると次の形になります。

JavaScript

function countdownWhile(n) { const result = []; let i = n; while (i >= 0) { result.push(i); i--; } return result; }

動作は同じです。for が 3 つの式を 1 行にまとめるのに対し、while条件式だけ を書き、初期化と更新は外に出す形になります。

while 文の文法はシンプル

JavaScriptwhile 文の基本形は次のとおりです。

JavaScript

while (条件) { // 繰り返したい処理 }

丸カッコの中には boolean を返す条件式を 1 つ書きます。条件が true の間は中の処理が繰り返され、false になった瞬間にループを抜ける、というシンプルな仕組みです。

  • 初期化while外で やる (let i = n; などをループの前に書く)
  • 条件 は丸カッコの中に書く (i >= 0 など)
  • 更新 はループ本体の中で行う (i--; などを result.push(i); の後に書く)

for だと 3 つが 1 行に集まっていたのに対し、while ではバラバラに配置されます。書き忘れると無限ループになるので、最初は意識して "初期化と更新" の場所を確認しながら書きましょう。

for でも while でもどっちでも書けるなら、どっちを使えばいいの?」というのは初学者がよく持つ疑問です。目安として、ループ変数の動きが規則的 (例 i++ で 1 ずつ増える) なら for、終了条件が複雑だったり外部イベント待ちなら while、と覚えておくと迷いません。

for を while に変換するパターン

forwhile は互いに書き換え可能です。次の対応関係を覚えておくと便利です。

JavaScript

// for 版 for (let i = 0; i < n; i++) { // 本体 } // while 版 let i = 0; while (i < n) { // 本体 i++; }

for の丸カッコ内の 初期化 がループ前へ、条件 がそのまま while の中へ、更新 が本体の末尾へ移動します。

for の部位while での配置注意点
初期化 let i = 0ループの外 (前)書き忘れると ReferenceError
条件 i < nwhile (...) の中書き忘れると構文エラー
更新 i++本体の末尾書き忘れると無限ループ

意味は同じなので、好きなほうを使えば OK ですが、慣習として「回数が明確 → for」「条件次第 → while」と使い分けると読みやすくなります。

実行フローを図で追ってみる

while (i >= 0) のループの流れは次のとおりです。

diagram (will load when visible)

n = 3 のときに iresult がどう変わるかを表にすると、次のとおりです。

反復開始 i条件 i >= 0result終了 i
13true[3]2
22true[3, 2]1
31true[3, 2, 1]0
40true[3, 2, 1, 0]-1
5-1false(return)-1

for のときと流れはほぼ同じですが、初期化と更新がループの に出ているのが違いです。図にすると「while の正体は、for の 3 つの式を分解した形」だということがよく分かります。

よくある間違い

while 文を使い始めるとき、初心者がほぼ全員ハマる落とし穴が 3 つあります。

  • 更新を忘れて無限ループwhile (i >= 0) { result.push(i); } のように、i-- を書き忘れると i が永遠に n のままで条件が false になりません。chotdekiru のような実行時間制限のある環境ではタイムアウトで止まりますが、本番では CPU を食い続けてフリーズします
  • 条件の向きを間違えるwhile (i <= 0) と書きたいところを while (i >= 0) にすると、想定と真逆の動きになります。条件は紙に書いて初期値で true になるか確認しましょう
  • 初期化を忘れるfor と違って初期化を外に書くため、let i = n; を書き忘れがちです。すると ReferenceError で実行できません

「無限ループになったらどうやって止めればいいの?」という質問もよく出ます。ブラウザの場合はタブを閉じる、Node.js の場合は Ctrl+C でプロセスを止める、というのが基本対処です。chotdekiru の Playground は実行時間に上限があるため、無限ループでも数秒で自動停止します。

もうひとつ、while の条件には boolean を返す式なら何でも書けます。i >= 0 のような比較演算子だけでなく、while (true) で永久ループにしたり、while (queue.length > 0) で配列が空になるまで処理したりもできます。条件を柔軟に書けるのが while の魅力です。

この章のポイント

ここまでの要点 while (条件) { ... } は条件が真の間繰り返す。for の 3 つの式を「外・中・末尾」に分解した形。更新を忘れると無限ループ、初期化を忘れると ReferenceError

やってみよう

それでは今回の課題に取り組みましょう。手順は次のとおりです。

  1. 関数 countdown(n) を定義する
  2. let i = n; と空配列 const result = []; を準備する
  3. while (i >= 0) { result.push(i); i--; } の形で書く
  4. ループを抜けたら return result;
  5. countdown(3)[3, 2, 1, 0]countdown(0)[0]countdown(5)[5, 4, 3, 2, 1, 0] になるか確認

余裕があれば、同じ動きを for 文でも書いてみてください。forwhile の対応関係が身体に染み込んで、どちらを使うべきかの判断が早くなります。

よくある質問

Q. while で無限ループを止めるには?

A. ループ内で必ずカウンタを更新するか、break で抜ける条件を書きます。たとえば i = 0; while i < 10: i += 1 のように i += 1 を忘れると永久に止まりません。Ctrl+C で強制終了できますが、デバッグ時はループの 1 周目で print(i) を入れて挙動を確認すると原因が見えます。

Q. while と for はどう違いますか?

A. 繰り返し回数が決まっていれば for、終了条件が動的なら while が向いています。リスト走査や range は for で書く方が安全で、ユーザー入力が来るまで・センサー値が閾値を超えるまで、のようなケースは while True + break が定石です。

Q. do-while のように最低 1 回は実行したい場合は?

A. Python には do-while がないため、while True: ... if cond: break のパターンで再現します。JavaScript なら do { ... } while (cond) と書けます。「最初の 1 回は条件を見ずに走らせる」処理(入力受付など)で有効です。

次のレッスン

次は do-while で必ず 1 回は実行する で、条件が満たされている間だけ繰り返す while 文を学び、n から 0 まで降順の配列を作ってみよう を学びます。

事前確認 — 進む前に次の 3 つができることを確認しましょう。

  1. while の要点を自分の言葉で説明できる
  2. このレッスンの最小コード (または操作手順) を見ずに書ける
  3. 練習問題やクイズで間違えた箇所を読み直して理解した

理解度チェック (30 秒)

Q. while とは何か、1 文で説明してください。

この章のポイント

A. 本文の「このレッスンで分かること」または冒頭の説明文を見直し、自分の言葉で要約できれば OK。詰まったら本レッスンの最初の H2 セクションを読み返してみましょう。

関連レッスン

要件

  1. 関数名は countdown、引数は n 1 つ、戻り値は数値の配列
  2. 繰り返し処理には必ず while 文を使うこと (for ではなく)
  3. 返す配列は n から 0 まで降順に並んでいること (0 も含む)

入出力例

test-cases.txt

countdown(3)[3,2,1,0] countdown(0)[0] countdown(5)[5,4,3,2,1,0] countdown(1)[1,0]

ヒント

main.js
main.js
学習モード

メモ

while でカウントダウン

⌘S で保存