在 JavaScript 中使用异常终止一个 forEach 循环
与其他编程语言不同,JavaScript 编程语言带有各种 for 循环的变体,我们只能看到传统的 for
循环,它由 3 件事组成-初始化,条件以及递增或递减。我们必须遵循这三个要素,以使传统的 for
循环工作。这似乎很令人困惑,特别是如果你是编程新手。
JavaScript 为我们提供了一种编写 for
循环的新方法,也就是 forEach
循环。forEach
循环用于遍历数组。许多开发人员更喜欢使用 forEach
循环而不是传统的 for
循环来遍历数组,因为它更容易编写且可读性更高。
任何循环,无论是 for
循环还是 while
循环,都可以借助 break
语句终止。使用 forEach
循环遍历数组的唯一缺点是无法使用 break
关键字终止它。有时在程序执行过程中某些特定条件成立(真或假)时,我们想终止 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
这是我们的 HTML 5 文档。在 <body>
标签内。我们有一个段落标签,其中的 id
是 errorMsg
。此段落标签将用于显示将由我们的 JavaScript 程序引发的错误消息。
在 <script>
标签内,我们有实际的程序。在这里,首先,我们声明了一个名为 arr
的数组,其中包含从 1 到 5 的元素。这里的主要目标是使用 forEach
循环对该数组进行迭代,当它到达 arr
数组中的元素 4
时中断循环。
在 try
块中,我们使用 forEach
循环遍历此数组。在此循环中,我们传入了匿名函数(也称为箭头函数)。在该函数内部,我们有一个 if
语句来检查数组中特定位置的元素是否为 4
。如果不是 4
,它将在网络浏览器的控制台中打印该元素。否则,将抛出异常,显示 number is equal to four
。
try
块引发的该异常将被 catch
块捕获,并存储在变量 e
中。现在,借助称为 innerHTML
的 HTML 属性,可以显示 p
标签内变量 e
内的错误消息。这是在 JavaScript 中遍历数组时在 forEach
循环内实现 break
功能的整个过程。
相关文章
Do you understand JavaScript closures?
发布时间:2025/02/21 浏览次数:108 分类:JavaScript
-
The function of a closure can be inferred from its name, suggesting that it is related to the concept of scope. A closure itself is a core concept in JavaScript, and being a core concept, it is naturally also a difficult one.
Do you know about the hidden traps in variables in JavaScript?
发布时间:2025/02/21 浏览次数:178 分类:JavaScript
-
Whether you're just starting to learn JavaScript or have been using it for a long time, I believe you'll encounter some traps related to JavaScript variable scope. The goal is to identify these traps before you fall into them, in order to av
How much do you know about the Prototype Chain?
发布时间:2025/02/21 浏览次数:150 分类:JavaScript
-
The prototype chain can be considered one of the core features of JavaScript, and certainly one of its more challenging aspects. If you've learned other object-oriented programming languages, you may find it somewhat confusing when you start
用 jQuery 检查复选框是否被选中
发布时间:2024/03/24 浏览次数:102 分类:JavaScript
-
在本教程中学习 jQuery 检查复选框是否被选中的所有很酷的方法。我们展示了使用直接 DOM 操作、提取 JavaScript 属性的 jQuery 方法以及使用 jQuery 选择器的不同方法。你还将找到许多有用的
jQuery 中的 Window.onload 与 $(document).ready
发布时间:2024/03/24 浏览次数:180 分类:JavaScript
-
本教程演示了如何在 jQuery 中使用 Window.onload 和 $(document).ready 事件。