极客教程JavaScript 如何停止forEach()方法
在JavaScript中，程序员可以使用forEach()方法来迭代数组中的元素。我们可以调用一个回调函数，我们可以把它作为forEach()方法的参数传递给每个数组元素。
有时，我们可能需要在对某些元素执行回调函数后停止forEach()循环。我们可以使用’break’关键字来停止一个正常的循环，如下图所示。
for(let i = 0; i < length; i++){
// code
if( some condition ){
break;
}
}
但是我们不能在forEach()方法中使用’break’关键字。
array.forEach(element => {
// code
if( some condition ){
break;
}
});
上述代码不会停止forEach()循环的执行。
本教程将讲授在JavaScript中停止forEach()循环的各种方法。
使用return关键字
return关键字会停止代码的执行。在forEach()循环中，它可以作为一个继续语句使用。
语法
用户可以按照下面的语法，使用return关键字来停止forEach()方法的执行。
array.forEach(function (element, index) {
if (condition) {
return;
}
});
在上面的语法中，如果条件变为真，就不会执行该元素的回调函数的代码。
示例1
在下面的例子中, 我们使用forEach()方法来处理字符串数组.我们为每个元素调用回调函数，打印出每个元素。我们使用的条件是，如果index>2，它将从回调函数中返回。所以它不会打印这个元素。
<html>
<body>
<h2>Using the <i>return keyword</i> to stop the execution of the forEach() loop.</h2>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let array = ["string1", "string2", 10, 20, false, true];
function callback(element, index) {
// stop execution of for-loop
if (index > 2) {
return; // works like a continue statement
}
output.innerHTML += "The array element is " + element + "<br/>";
}
array.forEach(callback);
</script>
</body>
</html>
return “关键字不会破坏forEach()方法，但是如果条件变成真的话，它可以作为一个连续的关键字。
通过抛出异常来停止forEach()循环的执行
另一种停止forEach()循环执行的方法是使用try-catch语句。当我们想停止forEach()方法的执行时，我们可以抛出错误。同时，我们可以在’catch’块中捕获错误。我们可以在’final’块中执行我们需要在forEach()方法之后执行的任何代码。
语法
用户可以按照下面的语法来使用try-catch语句停止forEach()方法。
try {
array.forEach((ele) => {
if (condition) {
throw new Error("Break the loop.")
}
})
} catch (error) {
}
在上面的语法中，我们使用了throw关键字来抛出异常，并打破forEach()方法。
示例2
在下面的例子中，我们使用了forEach()方法和try-catch语句。在forEach()方法的回调函数中，我们检查元素的类型，如果发现任何元素的类型是 “数字”，我们就抛出错误。
因此，它将停止forEach()方法的执行。
<html>
<body>
<h2>Using the <i>try-catch statement</i> to stop the execution of the forEach() loop.</h2>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let array = ["Cpp", "c", "Java", "JavaScript", 06, true, 43, false];
try {
array.forEach((ele) => {
if (typeof ele == "number") {
throw new Error("Break the loop.")
}
output.innerHTML += "Element value is " + ele + "<br/>";
})
} catch (error) {
output.innerHTML += "Exception thrown from the forEach loop. " + error;
}
</script>
</body>
</html>
在上面的输出中，用户可以观察到，它在找到数组中的数字类型元素后就停止了打印元素。
使用带有break关键字的普通for-loop
停止forEach()方法执行的最佳方案是用普通的for-loop代替forEach()循环，并使用break关键字来停止其执行。
语法
用户可以按照下面的语法来使用带有break关键字的for-loop。
for ( ){
if (condition) {
break;
}
}
在上面的语法中，当一个特定的条件为真时，我们用break关键字停止for-loop的执行。
示例3
在下面的例子中，我们已经定义了各种数值的数组。我们使用正常的for-loop来遍历数组，如果数组的值变得大于30，我们就使用break关键字来停止for-loop的执行。
<html>
<body>
<h2>Using the normal for-loop with break keyword to stop the execution of for-loop. </h2>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let arrayElements = [10, 20, 30, 40, 50, 60, 70, 80, 90];
output.innerHTML += "Some array elements are "
for (let k = 0; k < arrayElements.length; k++) {
if (arrayElements[k] > 30) {
break;
}
output.innerHTML += arrayElements[k] + " , ";
}
</script>
</body>
</html>
方法。第一种方法不会中断循环，但可以作为一个 “继续 “语句使用。第二种方法使用try-catch语句来中断forEach()方法。在现实的开发中，我们不能抛出错误来直接中断forEach()循环。所以，不建议使用第一和第二种方法。
在第三种方法中，我们将forEach()方法替换为正常的for-loop，并使用break关键字。第三种方法可以正常工作，但是正常的for-loop比forEach()方法对元素的迭代速度更慢。所以，用户也可以尝试使用array.some()和array.each()方法来提高性能。