TypeScriptの繰り返し文
この記事ではTypeScriptの繰り返し文について説明します。
YouTube Video
TypeScriptにおけるfor文
TypeScriptにおけるfor文は、繰り返し処理を行うための基本的なループ構文です。for文では、指定された回数や条件に基づいて、同じブロックのコードを繰り返し実行できます。
基本構文
1for (initialization; condition; update) {
2 // Code to execute repeatedly while the condition is true
3}- 初期化(
initialization): ループを開始する前に一度だけ実行される部分です。ループカウンターなどの変数を初期化します。 - 条件(
condition): ループを続けるかどうかを判断する条件です。trueであればループを続け、falseであれば終了します。 - 更新(
update): 各ループの終わりに実行され、ループカウンターを更新します。
例1: 基本的なforループ
以下の例では、0から4までの数字を順番に出力します。
1for (let i = 0; i < 5; i++) {
2 console.log("The value of i is: " + i);
3}
4// Outputs:
5// The value of i is: 0
6// The value of i is: 1
7// The value of i is: 2
8// The value of i is: 3
9// The value of i is: 4
例2: 配列を使ったforループ
配列の要素を順番に処理するために、for文を使うこともできます。
1let fruits: string[] = ["apple", "banana", "cherry"];
2
3for (let i = 0; i < fruits.length; i++) {
4 console.log("Fruit: " + fruits[i]);
5}
6// Outputs:
7// Fruit: apple
8// Fruit: banana
9// Fruit: cherry
例3: for-inループ
for-inループは、オブジェクトのプロパティや配列のインデックスを順番に取得するために使用されます。
1let car = { brand: "Toyota", model: "Corolla", year: 2020 };
2
3for (let key in car) {
4 console.log(key + ": " + car[key]);
5}
6// Outputs:
7// brand: Toyota
8// model: Corolla
9// year: 2020
例4: for-ofループ
for-ofループは、配列や文字列などのイテラブルオブジェクトから、各要素の値を順に取得するために使用されます。
1let colors: string[] = ["red", "green", "blue"];
2
3for (let color of colors) {
4 console.log("Color: " + color);
5}
6// Outputs:
7// Color: red
8// Color: green
9// Color: blue
例5: ネストされたforループ
forループを他のforループの中で使用する、いわゆるネストされたループも可能です。これにより、二重ループなどを実現できます。
1for (let i = 0; i < 3; i++) {
2 console.log("Outer loop i: " + i);
3 for (let j = 0; j < 2; j++) {
4 console.log(" Inner loop j: " + j);
5 }
6}
7// Outputs:
8// Outer loop i: 0
9// Inner loop j: 0
10// Inner loop j: 1
11// Outer loop i: 1
12// Inner loop j: 0
13// Inner loop j: 1
14// Outer loop i: 2
15// Inner loop j: 0
16// Inner loop j: 1
まとめ
for文は、指定した回数や条件で繰り返し処理を行います。for-inはオブジェクトのプロパティや配列のインデックスを取得するのに使います。for-ofは配列などのイテラブルオブジェクトから要素の値を取得します。- ネストされた
forループで複雑な繰り返し処理も可能です。
TypeScriptのfor文は、他のループと同様に強力で柔軟な繰り返し処理を提供します。
TypeScriptにおけるwhile文
TypeScriptにおけるwhile文は、指定された条件がtrueである間、繰り返し処理を実行するためのループ構文です。forループと似ていますが、whileループはあらかじめ反復回数が決まっていない場合や、条件によって繰り返しの制御を行いたい場合に適しています。
基本構文
1while (condition) {
2 // Code to execute repeatedly while the condition is true
3}- 条件: ループを実行する条件。この条件が
trueの間はループが続行され、falseになるとループが終了します。
例1: 基本的なwhileループ
以下の例では、iが5未満である間、iの値を出力し続けます。
1let i: number = 0;
2
3while (i < 5) {
4 console.log("The value of i is: " + i);
5 i++;
6}
7// Outputs:
8// The value of i is: 0
9// The value of i is: 1
10// The value of i is: 2
11// The value of i is: 3
12// The value of i is: 4
この例では、iが5以上になると条件がfalseになるため、ループが終了します。
例2: 無限ループの例
whileループで条件が常にtrueの場合、無限ループになることがあります。これは通常、プログラムが意図せず停止しなくなる原因となるため、注意が必要です。
1let x: number = 0;
2
3while (true) {
4 console.log("The value of x is: " + x);
5 x++;
6 if (x >= 5) {
7 break; // Exit the loop when the condition is met
8 }
9}
10// Outputs:
11// The value of x is: 0
12// The value of x is: 1
13// The value of x is: 2
14// The value of x is: 3
15// The value of x is: 4
break文を使用して、条件を満たしたらループを強制的に終了することができます。
例3: do-whileループ
do-whileループは、少なくとも一度は必ずループの処理が実行される構造です。条件の評価が処理の後で行われるため、条件がfalseでも最初の1回は処理が実行されます。
1let j: number = 5;
2
3do {
4 console.log("The value of j is: " + j);
5 j++;
6} while (j < 5);
7// Outputs: The value of j is: 5
この例では、jが最初から5で、j < 5がfalseですが、do-whileループでは最初の1回は条件に関係なく実行されます。
まとめ
whileループは、条件がtrueである限り処理を繰り返します。- ループの終了条件が曖昧な場合、無限ループに注意する必要があります。
do-whileループは、少なくとも1回は処理が実行される点で通常のwhileループと異なります。
TypeScriptのwhile文は、反復回数が不定なループ処理や、動的に条件をチェックする必要がある場面で役立ちます。
breakとcontinue
ループ内でbreakとcontinueを使えます。
breakは、ループを途中で終了するために使います。continueは、現在の反復をスキップして、次の反復に進みます。
break の例
1for (let i = 0; i < 10; i++) {
2 if (i === 5) {
3 break; // Exits the loop when i is 5
4 }
5 console.log(i);
6}
7// Outputs 0, 1, 2, 3, 4
8
9let i = 0;
10while (i < 10) {
11 if (i === 5) {
12 break; // Ends the loop when i is 5
13 }
14 console.log(i);
15 i++;
16}
17// Outputs 0, 1, 2, 3, 4
この場合、iが5になるとbreakが実行されます。結果として、0から4までが表示されます。
continue の例
1for (let i = 0; i < 5; i++) {
2 if (i === 2) {
3 continue; // Skips when i is 2
4 }
5 console.log(i);
6}
7// Outputs 0, 1, 3, 4
8
9let i = 0;
10while (i < 5) {
11 if (i === 2) {
12 i++;
13 continue; // Skips when i is 2
14 }
15 console.log(i);
16 i++;
17}
18// Outputs 0, 1, 3, 4
この場合、iが2の時にcontinueが実行されます。結果として、2以外の数値が表示されます。
TypeScriptにおける入れ子ループ
入れ子ループとは、1つのループの内部で別のループを使う構造のことです。TypeScriptでは、for、while、do-whileといったループ構文がサポートされています。入れ子ループを使用することで、例えば2次元配列（マトリックス）を処理したり、複数の条件に基づく処理を効率化することができます。
基本構文
入れ子ループの基本的な構文は次の通りです。
1for (let i: number = 0; i < n; i++) {
2 for (let j: number = 0; j < m; j++) {
3 // Processing for the inner loop
4 }
5}外側のループが1度実行されるたびに、内側のループがすべての繰り返しを完了します。この構造は多重ループやデータ構造を扱うときに非常に便利です。
TypeScriptでの入れ子ループの例
2次元配列の走査
入れ子ループは2次元配列のような多次元データ構造を操作する場合によく使用されます。次の例では、2次元配列の要素を走査し、その値をコンソールに表示します。
1const matrix: number[][] = [
2 [1, 2, 3],
3 [4, 5, 6],
4 [7, 8, 9]
5];
6
7for (let row: number = 0; row < matrix.length; row++) {
8 for (let col: number = 0; col < matrix[row].length; col++) {
9 console.log(`matrix[${row}][${col}] = ${matrix[row][col]}`);
10 }
11}
12// Output
13// matrix[0][0] = 1
14// matrix[0][1] = 2
15// matrix[0][2] = 3
16// matrix[1][0] = 4
17// matrix[1][1] = 5
18// matrix[1][2] = 6
19// matrix[2][0] = 7
20// matrix[2][1] = 8
21// matrix[2][2] = 9
この例では、2次元配列 matrix を走査しています。外側のループは行（row）を、内側のループは列（col）を担当し、各要素を順番に表示しています。
2つの配列の組み合わせ
次に、2つの配列のすべての組み合わせを計算する場合の例を紹介します。例えば、2つの配列からそれぞれの要素を1つずつ取り出して、可能なすべてのペアを出力することができます。
1const array1: string[] = ['A', 'B', 'C'];
2const array2: number[] = [1, 2, 3];
3
4for (let i: number = 0; i < array1.length; i++) {
5 for (let j: number = 0; j < array2.length; j++) {
6 console.log(`Pair: (${array1[i]}, ${array2[j]})`);
7 }
8}
9// Output
10// Pair: (A, 1)
11// Pair: (A, 2)
12// Pair: (A, 3)
13// Pair: (B, 1)
14// Pair: (B, 2)
15// Pair: (B, 3)
16// Pair: (C, 1)
17// Pair: (C, 2)
18// Pair: (C, 3)
この例では、文字列配列 array1 と数値配列 array2 のすべてのペアを作成しています。外側のループで array1 の要素を、内側のループで array2 の要素をそれぞれ取り出し、ペアを表示しています。
三重ループでの座標の生成
三重の入れ子ループを使用することで、例えば3次元空間上の座標を生成することができます。
1for (let x: number = 0; x < 3; x++) {
2 for (let y: number = 0; y < 3; y++) {
3 for (let z: number = 0; z < 3; z++) {
4 console.log(`Coordinate: (${x}, ${y}, ${z})`);
5 }
6 }
7}
8// Output
9// Coordinate: (0, 0, 0)
10// Coordinate: (0, 0, 1)
11// Coordinate: (0, 0, 2)
12// ...
13// Coordinate: (2, 2, 1)
14// Coordinate: (2, 2, 2)
このように、三重の入れ子ループを使うと3次元空間上の座標を簡単に生成できます。
入れ子ループのパフォーマンス
入れ子ループは便利ですが、ループの深さが増えるほど計算量が急激に増加します。例えば、n 回の外側ループと m 回の内側ループがある場合、全体の繰り返し回数は n * m 回となります。これがさらに多重の入れ子になると、計算量は指数的に増加し、プログラムのパフォーマンスに影響を与える可能性があります。
以下に、3つの配列を走査する場合の計算量を示します。
1const array1: number[] = [1, 2, 3];
2const array2: number[] = [4, 5, 6];
3const array3: number[] = [7, 8, 9];
4
5for (let i: number = 0; i < array1.length; i++) {
6 for (let j: number = 0; j < array2.length; j++) {
7 for (let k: number = 0; k < array3.length; k++) {
8 console.log(`Combination: (${array1[i]}, ${array2[j]}, ${array3[k]})`);
9 }
10 }
11}この場合、array1、array2、array3のそれぞれの長さを掛け合わせた回数の繰り返しになり、すべての組み合わせを処理するために合計27回の繰り返しが発生します。
入れ子ループの最適化
入れ子ループを使用するときは、次のような最適化を考慮することで、パフォーマンスを改善できます。
- 早期リターンの導入: 目的が達成された場合にループから早期に抜けることで、不要な繰り返しを避けます。
- ループ変数のキャッシング: ループ内で使用する変数の値（特に長さや範囲など）をあらかじめキャッシュすることで、毎回計算するコストを削減できます。
- データ構造の変更: 特定の繰り返し処理を高速化するために、配列やオブジェクトの構造を見直すことも有効です。
結論
入れ子ループは、複雑なデータ処理やアルゴリズムにおいて強力なツールです。しかし、ループの深さや繰り返し回数が増えると、パフォーマンスの問題が発生する可能性があります。適切な最適化と注意深い設計を行うことで、TypeScriptにおける入れ子ループを効果的に活用できるでしょう。
YouTubeチャンネルでは、Visual Studio Codeを用いて上記の記事を見ながら確認できます。 ぜひYouTubeチャンネルもご覧ください。