繰り返し — 同じことを正確に何度もさせる

1.なぜ繰り返し文が必要なのか

第1講では、プログラムを順序・条件・繰り返しに分解してみました。第3講の条件文が「分かれ道」だとすれば、今回の繰り返し文は「引き返す道」です。1から5までを画面に出すなら console.log を5行書いてもかまいませんが、1から1,000までとなると話が変わります。行をコピーして貼り付けると間違えやすく、数字を変えたくなったらすべての行を直さなければなりません。

繰り返し文は「この作業を、この条件が成り立つ間ずっと続けなさい」と一度だけ書く文法です。人は同じ作業を長く続けると疲れて間違えますが、コンピューターは百回目も一回目とまったく同じようにこなします。その代わり、コンピューターはいつ止まるべきかを自分では判断できないので、止める条件を人が正確に書いてあげる必要があります。この講義では終始、「何を繰り返すのか」と「いつ止めるのか」をセットで考える練習をします。

下のコードは、5行書く代わりに繰り返し文一つで同じ結果を出します。数字の 5 を 1000 に変えれば1,000行が出力されますが、コードは数文字しか変わりません。これが、繰り返し文が自動化の出発点である理由です。

for (let i = 1; i <= 5; i++) {
  console.log(i + '回目のあいさつ: こんにちは');
}

1回目のあいさつ: こんにちは
2回目のあいさつ: こんにちは
3回目のあいさつ: こんにちは
4回目のあいさつ: こんにちは
5回目のあいさつ: こんにちは

2.`for` 文 — 回数が決まっている繰り返し

for 文のかっこの中には、セミコロンで区切られた三つの部分が入ります。一つ目は最初に一度だけ実行する準備（let i = 1）、二つ目は毎回繰り返す前に確かめる条件（i <= 5）、三つ目は一周が終わるたびに行うこと（i++）です。i++ は i = i + 1 を短く書いたものです。条件が true の間は波かっこの中の本体が実行され、条件が false になった瞬間に繰り返しが終わります。

実行の順番を正確に知っておくことが大切です。準備 → 条件の確認 → 本体 → 増加 → 条件の確認 → 本体 → 増加 … の順に回り、条件が偽になると本体を飛ばして繰り返し文の下へ進みます。そのため、最後の i は条件を初めて破った値になります。下の表のように変数の値を一行ずつ書き出すことを「トレース（追跡）」と呼び、繰り返し文がおかしな動きをしたときに真っ先に試すことです。

繰り返しの変数名に i を使うのは昔からの慣習にすぎず、規則ではありません。意味がはっきりするなら month や page のように名前を付けてもかまいません。繰り返しの変数は値が変わるので、const ではなく let で宣言します（第2講）。

const dan = 2;
for (let i = 1; i <= 4; i++) {
  console.log(dan + ' x ' + i + ' = ' + dan * i);
}

2 x 1 = 2
2 x 2 = 4
2 x 3 = 6
2 x 4 = 8

3.`for...of` と二つの基本パターン — 累積と数え上げ

リストに入った値を一つずつ取り出して使うときは、for...of がいちばん読みやすい書き方です。for (const x of list) と書くと、list の値が先頭から順に x に入ります。何番目かを数える必要がないので、番号を取り違える失敗が減ります。リスト（配列）は第6講で詳しく扱います。ここでは、角かっこの中に値をカンマで並べたものだとだけ覚えておけば十分です。

繰り返し文で行う作業の多くは、二つのパターンにまとめられます。累積パターンは、繰り返しの前に let sum = 0 のような「まだ何もない値」を用意しておき、一周ごとに値を足して積み上げます。数え上げパターンは let count = 0 から始め、条件に合うときだけ1を足します。どちらのパターンも初期値が重要です。合計の初期値は0、積の初期値は1、文字をつなげていくときの初期値は空文字列 '' です。

累積用の変数を繰り返し文の中で宣言すると、毎周0として作り直されて合計が積み上がりません。必ず繰り返し文の外、上の方で宣言してください。反対に、結果を出力する console.log は、ふつう繰り返し文が終わった下に置きます。中に置くと途中の合計が周ごとに出力されます。途中の値を見たいときは、わざと中に入れて追跡用に使うこともあります。

const sales = [12000, 8500, 30000, 4000];
let sum = 0;
let count = 0;
for (const won of sales) {
  sum += won;
  if (won >= 10000) {
    count++;
  }
}
console.log('合計', sum);
console.log('1万ウォン以上', count + '件');

合計 54500
1万ウォン以上 2件

const scores = [70, 85, 90, 60];
let total = 0;
for (const s of scores) {
  total += s;
}
console.log(total / scores.length);

76.25

4.`while` 文と無限ループ — 終了条件を変えるのは誰か

while 文は条件を一つだけ受け取り、条件が真の間は本体を実行し続けます。何回回るか前もってわからず、「目標に届くまで」繰り返したいときによく合います。たとえば毎月同じ額を積み立てて目標額に届くまで何か月かかるかは、計算式でも求められますが、一か月ずつ足しながら数えるのがいちばん直感的です。

while を使うときに必ず確かめたいのは、「本体の中に条件を変える行があるか」という問いです。下のコードで saved += 50000 がなければ saved は永遠に0のままで、条件も永遠に真です。これが無限ループです。無限ループに陥ったプログラムはエラーメッセージも出さずに回り続けるので、ブラウザーのタブが応答しなくなったように見えます。このページの練習場は、コードが2秒以内に終わらなければ強制的に止めて「時間制限」を知らせます。

無限ループを防ぐ点検方法は三つあります。条件に使われている変数が本体の中で変わるか、変わる向きが条件を偽にする方向か（0から始めて引くだけなら目標から遠ざかります）、そしてぴったり同じになったときだけ止まる !== の条件ではなく、超えても止まる < のような条件を使っているかです。第2講で見た 0.1 + 0.2 のように小数はぴったり同じにならないことがあるので、!== で止めるのは危険です。

const goal = 300000;
let saved = 0;
let months = 0;
while (saved < goal) {
  saved += 50000;
  months++;
}
console.log(months + 'か月後', saved + 'ウォン');

6か月後 300000ウォン

5.`break` と `continue` — 早めに止める、飛ばす

break は繰り返し文からすぐに抜け出します。リストの中で条件に合う最初の値だけ見つければよいとき、見つけたあとも最後まで回るのは無駄なので break で止めます。continue は今回の周の残りを飛ばして次の周へ進みます。空の値や不正な値を取り除き、残りだけを処理したいときに使います。

この二つのキーワードは便利ですが、使いすぎると流れを追いにくくなります。一つの繰り返し文に break と continue がいくつも混ざっているなら、条件文で書き直すか、第5講で学ぶ関数に分けたほうが読みやすくなります。特に関数の中では、return が繰り返し文と関数をまとめて終わらせるので、「見つけたらすぐ返す」という意図をよりはっきり示せます。

「見つからなかった場合」も必ず考えておきましょう。下の最初のコードで found の初期値を -1 にしているのは、「まだ見つかっていない」という印です。繰り返しが終わってもまだ -1 なら、リストに条件に合う値がなかったという意味です。配列の indexOf が見つからないときに -1 を返すのも同じ約束です（第6講）。

const temps = [3, 1, -2, 5, -4];
let found = -1;
for (let i = 0; i < temps.length; i++) {
  if (temps[i] < 0) {
    found = i;
    break;
  }
}
console.log('最初の氷点下の位置', found);

最初の氷点下の位置 2

const items = ['りんご', '', 'なし', '', 'みかん'];
for (const name of items) {
  if (name === '') {
    continue;
  }
  console.log(name);
}

りんご
なし
みかん

6.off-by-one — 一つずれて間違える、いちばんよくある失敗

繰り返し文のバグでいちばん多いのは、一回多く回ったり一回少なく回ったりする失敗です。英語では off-by-one（一つずれ）エラーと呼びます。原因はたいてい三つです。0から始めるか1から始めるか、条件に < を使うか <= を使うか、そして「個数」と「最後の番号」を取り違えることです。配列の位置は0から数えるので、長さが5の配列の最後の位置は5ではなく4です。

植木算の問題で感覚をつかみましょう。10mの柵に1m間隔で柱を立てると、柱は10本ではなく11本です。区間の数と端点の数は一つ違います。同じように、for (let i = 0; i < 5; i++) は0・1・2・3・4で5回、for (let i = 1; i <= 5; i++) は1〜5で5回、for (let i = 0; i <= 5; i++) は0〜5で6回回ります。同じ「5」が入っていても回数が違うのです。

off-by-one を捕まえるいちばん確実な方法は、境界値で実際に試すことです。第3講で条件文の境界値を確かめたように、繰り返し文では「0個のとき、1個のとき、最後の一つ」を必ず入れてみます。配列を位置で回していて i <= arr.length と一つはみ出すと、最後の周で arr[i] が undefined になり、合計が NaN に変わります。エラーメッセージなしにおかしな値が出るので、なおさら見つけにくくなります。位置が必要ないなら for...of を使うのが、この失敗をそもそも避ける方法です。

const nums = [10, 20, 30];
let a = 0;
for (let i = 0; i <= nums.length; i++) {
  a += nums[i];
}
console.log('一つはみ出した合計', a);
let b = 0;
for (let i = 0; i < nums.length; i++) {
  b += nums[i];
}
console.log('正しい合計', b);

一つはみ出した合計 NaN
正しい合計 60

• リストが空のとき（0個）に結果が筋の通ったものになるか — 合計0、個数0、平均は別に扱う
• 値が一つだけのとき、繰り返しがちょうど一回回るか
• 最後の値が処理されるか — 条件が < か <= かを確認する
• 条件に使われた変数が本体の中で変わり、いつか偽になるか
• 累積用の変数が繰り返し文の外で宣言されているか

7.繰り返し文を読んで判断する — AIが書いたコードを前にして

AIのコーディングアシスタントに「リストの合計を求めて」と頼めば、繰り返し文の入ったコードがすぐに手に入ります。けれども、そのコードが自分のデータで正しく動くかどうかは自分で確かめなければなりません。繰り返し文を読むときに探すのは三つだけです。繰り返しの前に何を用意するか（初期値）、一周で何をするか（本体）、いつ止まるか（終了条件）です。この三つをそれぞれ一文で言葉にできれば、そのコードを理解したことになります。

次に、小さな入力で手作業のトレースをしてみます。値が三つほどのリストを入れ、上で作ったトレース表のように周ごとの変数の値を書き出してから、実際の実行結果と比べます。空のリストと値が一つだけのリストも入れてみましょう。ここで結果が違ったら、AIに「この入力でこの結果が出たが、期待値はこれだ」と具体的に伝えると、ずっと早く直せます。エラーを読んで原因を絞り込む方法は第8講、AIのコードを検証する方法は第10講でさらに詳しく扱います。