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

生徒

「繰り返し処理って、どうやってTypeScriptで書くんですか？」

先生

「繰り返し処理には、forループやwhileループなどの構文を使います。何回も同じような処理を繰り返したいときに便利ですよ。」

生徒

「何回も？例えば何かを10回表示するとかですか？」

先生

「そうです。それでは、forループとwhileループの基本を一緒に学んでいきましょう！」

1. 繰り返し処理（ループ）とは？

繰り返し処理とは、同じ処理を何度も実行することです。例えば、「同じメッセージを10回表示したい」といったときに使います。

TypeScriptでは、主に以下のようなループ構文があります：

for文：決まった回数だけ繰り返すときに使います
while文：ある条件が「真（true）」の間、ずっと繰り返します

これらを使うことで、プログラムを効率よく、無駄なく書くことができます。

2. for文の基本的な使い方

for文は「最初に準備 → 条件をチェック → 実行後に次の準備」を毎回行う構文です。

例えば、「1から5までの数字を表示したい」場合は以下のように書きます：


for (let i = 1; i <= 5; i++) {
    console.log("数字：" + i);
}

このfor文の意味は次のとおりです：

let i = 1; 最初に変数iを1にする
i <= 5; 変数iが5以下の間は処理を続ける
i++; 処理が終わるたびにiを1つ増やす

出力結果は以下のようになります：


数字：1
数字：2
数字：3
数字：4
数字：5

3. while文の基本的な使い方

while文は、「条件が成り立つ限り」ずっと繰り返す処理です。

同じく「1から5までの数字を表示したい」場合の例は以下のとおりです：


let i = 1;
while (i <= 5) {
    console.log("カウント：" + i);
    i++;
}

このwhile文のポイント：

let i = 1; 最初にiを1に設定
i <= 5; 条件が満たされている間はループを続ける
i++; 1ずつ数を増やしていく

出力結果：


カウント：1
カウント：2
カウント：3
カウント：4
カウント：5

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

while文では、条件をうっかり間違えると「無限ループ」になることがあります。

例えば、次のようなコードはループが終わりません：


let i = 1;
while (i <= 5) {
    console.log(i);
    // i++ がないので、iはずっと1のまま
}

このような書き方だと、条件がtrueのままになって、止まらないループになります。必ずループ内で変数を更新するようにしましょう。

5. 実践例：合計値を求める

for文やwhile文を使うと、数字を足し合わせることも簡単にできます。例えば、「1から10までの合計」を求めたいとき：

for文を使った例：


let total = 0;
for (let i = 1; i <= 10; i++) {
    total += i;
}
console.log("合計：" + total);


合計：55

while文を使った例：


let total = 0;
let i = 1;
while (i <= 10) {
    total += i;
    i++;
}
console.log("合計：" + total);


合計：55

このように、どちらのループ構文でも同じ結果を出すことができます。

6. forとwhileの使い分けポイント

for文とwhile文は、似ているようで使い方に違いがあります。

for文：最初から「何回繰り返すか」が決まっているときに使う
while文：回数が決まっておらず、「条件に応じて繰り返したい」ときに使う

まずはfor文から覚えていくと理解しやすいです。

まとめ

ここまで、TypeScriptにおけるforループとwhileループの基本から、無限ループの注意点、実践的な例まで順を追って学んできました。あらためて振り返ってみると、反復処理という仕組みが日常のプログラミングにどれほど欠かせないものなのかが、より具体的に理解できたのではないでしょうか。繰り返しを正確に扱えるようになると、配列操作、数値計算、データ処理など、あらゆる場面で効率的にコードを書けるようになります。

特に、for文は「決まった回数を繰り返す」ときに非常に便利で、変数の初期化・条件式・増減処理がひと目で分かるため、初心者にも扱いやすい構文です。一方で、while文は「条件が成り立つ限り続ける」という柔軟性があり、状況に応じて繰り返し回数が変わるような処理に向いています。それぞれの特徴を知っておくことで、プログラムの意図がより明確になり、読みやすいコードが書けるようになります。

また、反復処理を使う際に避けて通れないのが無限ループの問題です。条件式がずっと「真」のまま変化しなければ、プログラムは止まらなくなってしまいます。今回の記事でも触れたとおり、必ず更新処理を入れておくことが重要です。この基本を押さえておくことで、予期せぬバグを未然に防ぐことができます。

さらに、数字の合計を求めるサンプルのように、実際の処理を組み合わせるとループの理解は一気に深まります。繰り返し処理は単なる構文ではなく、「データをどのように扱い、どのように計算し、どのように繰り返すか」を整理するための手段でもあります。TypeScriptでの学習を進める中で、こうした反復処理の基礎が自然に身に付いていくほど、より複雑なロジックも無理なく扱えるようになっていくでしょう。

サンプルプログラムで振り返る

ここで、反復処理の理解をさらに深められるように、少し応用的なループの例を紹介します。ここでは、配列の中にある文字列を順番に表示するコードをTypeScriptで書いてみます。


const fruits = ["りんご", "みかん", "ぶどう", "もも"];

for (let i = 0; i < fruits.length; i++) {
    console.log("フルーツ：" + fruits[i]);
}

let index = 0;
while (index < fruits.length) {
    console.log("カウント：" + fruits[index]);
    index++;
}

この例では、for文とwhile文の両方を使って同じリストを順番に表示しています。配列の長さを基準に処理を進めていくことで、事前に回数を指定しなくても柔軟なループが組めます。こうした配列処理は、実務でも非常に頻繁に使われる構造なので、使い慣れておくと大きな武器になります。

反復処理は、単純な数字のカウントから複雑なデータ処理まで、幅広いプログラムの土台となる考え方です。TypeScriptのコードを読み解くときにも、自分で処理を組むときにも、ループの仕組みをしっかり押さえておくと、より明確で安全なコードが書けるようになります。今回の内容を踏まえて、ぜひ自分でも応用的な反復処理に挑戦してみてください。

先生と生徒の振り返り会話

生徒

「先生、今日の内容を通して、for文とwhile文の違いがよく分かってきました。使い分けが大事なんですね。」

先生

「その通りです。反復処理はTypeScriptの基本ですから、状況に応じて使い分けられるようになれば、コードの質はぐっと良くなりますよ。」

生徒

「無限ループになるケースの説明も助かりました。条件の書き方や変数の更新が大事なんですね。」

先生

「そうです。たった一行忘れるだけで大きな問題につながることもあるので、丁寧な確認が必要です。」

生徒

「配列を扱うサンプルも分かりやすかったです。実践でもよく使うと思うので、練習して慣れていきたいです。」

先生