プログラミングスキルアップ！JavaScriptのネストループを使いこなしてレベルアップ
JavaScriptでネストされたループから抜け出す方法
break ステートメント
最もシンプルな方法は、break ステートメントを使用することです。break ステートメントは、現在実行中のループを即座に終了します。
for (let i = 0; i < 10; i++) {
for (let j = 0; j < 10; j++) {
if (i === 5 && j === 5) {
break;
}
console.log(i, j);
}
}
この例では、i と j の両方が 5 になった時点で、内側のループと外側のループの両方から抜け出します。
メリット:
- シンプルで分かりやすい
- すべてのブラウザでサポートされている
- すべてのループから抜け出す場合、すべてのループに
breakステートメントが必要 - ネストが深いループの場合、コードが冗長になる
continue ステートメントは、現在実行中のループの残りの処理をスキップし、次のイテレーションに移ります。
for (let i = 0; i < 10; i++) {
if (i % 2 === 0) {
continue;
}
for (let j = 0; j < 10; j++) {
console.log(i, j);
}
}
この例では、i が偶数の場合は、内側のループを実行せずに次のイテレーションに移ります。
- すべてのループから抜け出す必要がない
- すべてのループから抜け出す場合、
breakステートメントよりも冗長になる
ラベルを使用して、特定のループから抜け出すことができます。
outerLoop: for (let i = 0; i < 10; i++) {
innerLoop: for (let j = 0; j < 10; j++) {
if (i === 5 && j === 5) {
break outerLoop;
}
console.log(i, j);
}
}
この例では、break outerLoop ステートメントによって、outerLoop ラベル付きの外側のループから抜け出します。
- 複雑なネスト構造の場合、コードを分かりやすくできる
- ラベルの使い方が分かりにくい
return ステートメント
関数から抜け出す場合は、return ステートメントを使用できます。
function myFunction() {
for (let i = 0; i < 10; i++) {
if (i === 5) {
return;
}
console.log(i);
}
}
myFunction();
この例では、i が 5 になった時点で、myFunction 関数から抜け出します。
- 関数から抜け出す場合、シンプルで分かりやすい
ネストされたループから抜け出す方法はいくつかあります。それぞれの方法にはメリットとデメリットがあり、状況によって使い分ける必要があります。
// 1. `break` ステートメント
for (let i = 0; i < 10; i++) {
for (let j = 0; j < 10; j++) {
if (i === 5 && j === 5) {
break;
}
console.log(i, j);
}
}
// 2. `continue` ステートメント
for (let i = 0; i < 10; i++) {
if (i % 2 === 0) {
continue;
}
for (let j = 0; j < 10; j++) {
console.log(i, j);
}
}
// 3. ラベル
outerLoop: for (let i = 0; i < 10; i++) {
innerLoop: for (let j = 0; j < 10; j++) {
if (i === 5 && j === 5) {
break outerLoop;
}
console.log(i, j);
}
}
// 4. `return` ステートメント
function myFunction() {
for (let i = 0; i < 10; i++) {
if (i === 5) {
return;
}
console.log(i);
}
}
myFunction();
このコードを実行すると、以下のような出力が得られます。
0 0
0 1
0 2
0 3
0 4
1 0
1 1
1 2
1 3
1 4
2 0
2 1
2 2
2 3
2 4
3 0
3 1
3 2
3 3
3 4
4 0
4 1
4 2
4 3
4 4
5 0
5 1
5 2
5 3
5 4
6 0
6 1
6 2
6 3
6 4
7 0
7 1
7 2
7 3
7 4
8 0
8 1
8 2
8 3
8 4
9 0
9 1
9 2
9 3
9 4
0
1
2
3
4
説明
break ステートメント
continue ステートメント
ラベル
ネストされたループから抜け出すその他の方法
for...of ループを使用すると、ループを途中で抜け出すための特別な構文は必要ありません。ループ変数をイテレータとして使用し、break ステートメントを使用してループを終了できます。
const numbers = [1, 2, 3, 4, 5];
for (const number of numbers) {
if (number === 3) {
break;
}
console.log(number);
}
この例では、number が 3 になった時点で、ループを終了します。
forEach メソッドを使用して、配列の要素をループ処理することができます。forEach メソッドは、ループを途中で抜け出すための特別な構文は必要ありません。ループ処理を途中で中止したい場合は、return ステートメントを使用できます。
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(number => {
if (number === 3) {
return;
}
console.log(number);
});
some メソッドを使用して、配列の要素に条件を満たすものがあるかどうかを確認することができます。some メソッドは、条件を満たす要素が見つかった時点で、ループ処理を中止します。
const numbers = [1, 2, 3, 4, 5];
const isEven = number => number % 2 === 0;
const hasEvenNumber = numbers.some(isEven);
console.log(hasEvenNumber); // true
この例では、配列の中に偶数があるかどうかを確認します。偶数が見つかった時点で、ループ処理は中止されます。
const numbers = [1, 2, 3, 4, 5];
const isEven = number => number % 2 === 0;
const allEvenNumbers = numbers.every(isEven);
console.log(allEvenNumbers); // false
ネストされたループから抜け出す方法はいくつかあります。状況によって最適な方法を選択する必要があります。
javascript loops nested-loops
