JavaScript の例外を使用して forEach ループを終了する
JavaScript プログラミング言語にはさまざまな for
ループのバリエーションが付属していますが、他のプログラミング言語とは異なり、初期化、条件、インクリメントまたはデクリメントの 3つで構成される従来の for
ループしか表示されません。従来の for
ループを機能させるには、これら 3つの要素に従う必要があります。特にプログラミングに不慣れな場合は、かなり混乱するように思われるかもしれません。
JavaScript は、for
ループを記述する新しい方法を提供してくれました。それが forEach
ループです。forEach
ループは、配列を反復処理するために使用されます。多くの開発者は、従来の for
ループよりも forEach
ループを使用して配列を反復処理することを好みます。これは、記述がはるかに簡単で、読みやすいためです。
for
ループまたは while
ループのいずれかのループは、break
ステートメントを使用して終了できます。forEach
ループを使用して配列を反復処理する場合の唯一の欠点は、break
キーワードを使用して配列を終了できないことです。プログラムの実行中に特定の条件(true または false)が成立したときに、forEach
ループを終了したい場合があります。したがって、そのために、例外処理を使用できます。
JavaScript の try...catch
ブロックを使用して forEach
ループを終了する
array.forEach
ループ内の break
ステートメントによって提供される機能を実現するために、JavaScript で使用可能な例外処理の概念を使用できます。例外処理は、プログラムの実行中にエラーが発生した場合の異常状態の処理と、不要なプログラムのクラッシュの回避に他なりません。これは、try...catch
ブロックの助けを借りて行われます。
try
ブロックは、すべてのコードを記述する場所です。また、catch
ブロックには、例外を処理するために使用されるコードが含まれます。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<p id="errorMsg"></p>
<script>
var arr = [1, 2, 3, 4, 5]
try {
arr.forEach((element)=> {
if (element === 4) throw "number is equal to four";
console.log(element);
});
}
catch (e) {
errorMsg = document.getElementById('errorMsg');
errorMsg.innerHTML = "Error: " + e + ".";
}
</script>
</body>
</html>
出力:
// The below output will be printed on the screen.
Error: number is equal to four.
// The below output will be printed inside the web browser console
1
2
3
これは HTML5 ドキュメントです。<body>
タグ内。1つの段落タグがあり、その id
は errorMsg
です。この段落タグは、JavaScript プログラムによってスローされるエラーメッセージを表示するために使用されます。
<script>
タグの中に、実際のプログラムがあります。ここでは、最初に、1 から 5 までの要素を含む arr
という配列を宣言しました。ここでの主な目標は、forEach
ループを使用してこの配列を反復処理し、arr
配列内の要素 4
に到達した時点でループを解除することです。
try
ブロックでは、forEach
ループを使用してこの配列を反復処理します。このループ内で、無名関数(矢印関数とも呼ばれます)を渡しました。その関数内には、配列内の特定の位置にある要素が 4
であるかどうかを確認するための if
ステートメントがあります。4
でない場合は、その要素を Web ブラウザのコンソールに出力します。それ以外の場合は、number is equal to four
という例外がスローされます。
try
ブロックによってスローされたこの例外は、catch
ブロックによってキャッチされ、変数 e
内に格納されます。これで、innerHTML
と呼ばれる HTML プロパティを使用して、p
タグ内の変数 e
内に存在するエラーメッセージを表示できます。これは、JavaScript で配列を反復処理しながら、forEach
ループ内に break
機能を実装するプロセス全体です。
Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.
LinkedIn