在JavaScript中终止forEach循环的三种方式

更新日期: 2023-12-12阅读: 1k标签: 循环

面试官:你能停止 JavaScript 中的 forEach 循环吗?这是我在采访中曾经被问到的一个问题,我最初的回答是:“不,我不能这样做。”

不幸的是,我的回答导致面试官突然结束了面试。突然。

我对结果感到沮丧,问面试官:“为什么?实际上可以停止 JavaScript 中的 forEach 循环吗?”

在面试官回答之前,我花了一些时间解释我对为什么我们不能直接停止 JavaScript 中的 forEach 循环的理解。


一、序言

这个问题估计会难倒一部分同学。甚至会有人反问,forEach循环在JavaScript中能终止吗? 比如 ,我举个例子

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.forEach((it) => {
if (it >= 0) {
console.log(it)
// 0 1 2 3
return // or break
}
})

从这个例子来看,好像不管是通过return还是break都无法终止forEach循环。 forEach相当于就是函数的执行,比如下面这段代码,即使func1执行了return语句,仍然会打印出2。

const func1 = () => {
console.log(1)
return
}

const func2 = () => {
func1()
console.log(2)
}

func2()


二、方法

然而,我能想到三种方式可以终止forEach循环。

1. 抛出错误

当找到一个大于等于0的数字之后,return循环将终止执行,所以控制台只会输出数字0,代码如下:

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

try {
array.forEach((it) => {
if (it >= 0) {
console.log(it) // 输出:0
throw Error(`We've found the target element.`)
}
})
} catch (err) {

}

2. 将数组长度设置成0

我们也能通过将数组长度设置成0来终止forEach循环。代码如下

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.forEach((it) => {
if (it >= 0) {
console.log(it) // 输出:0
array.length = 0
}
})

3. 将数组元素移除

当满足条件时,使用splice方法将数组内元素移除,也能终止forEach循环。代码如下:

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.forEach((it, i) => {
if (it >= 0) {
console.log(it) // 输出:0
array.splice(i + 1, array.length - i)
}
})


三、建议

建议使用for和some

在日常工作中,一般是不会出现一种情况是让你终止forEach循环的,如果有终止的情况,可以使用for和some方法。

for

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

for (let i = 0, len = array.length; i < len; i++) {
if (array[ i ] >= 0) {
console.log(array[ i ])
break
}
}

some

const array = [ -3, -2, -1, 0, 1, 2, 3 ]

array.some((it, i) => {
if (it >= 0) {
console.log(it)
return true
}
})

到此这篇关于在JavaScript中终止forEach循环的三种方式的文章就介绍到这了。

链接: https://www.fly63.com/article/detial/12612

跳出 forEach

使用for...in遍历对象时,会遍历原型链上的可枚举属性,这可能会导致一些意想不到的问题。所以你一定收到过这样的建议,使用数组的forEach来代替for...in循环。本文给大家总结了5种在forEach中跳出循环的变通之法

JavaScript循环下的async/await

在进行业务开发的过程中,使用了数组的高级函数map,同时使用了ES6语法async/await,发现在map循环下任务是异步执行的,并不符合预期。Array的循环方法map、forEach、filter、reduce、some、every等是并行迭代,可以理解为async/await的效果是无效的

如何中断forEach循环

在使用for循环的时候可以使用break 或者return语句来结束for循环(return直接结束函数),但是如果使用forEach循环如何跳出循环呢?首先尝试一使用return语句----木有效果

用于JavaScript中的循环和同时循环

如果您需要重复大量的代码数百次,这会变得非常笨拙。而且,它也不是很有用。例如,如果希望它重复X次呢?这就是循环的用武之地。次数通常由变量决定,但也可以由实际数字决定。

Js中循环执行

循环:就是一遍又一遍执行相同或者相似的代码,循环的两个要素:循环体:重复执行的代码;循环条件:控制循环的次数

为啥要放弃for循环?

创建一个新的数组,新的数组中的元素是通过检查指定数组中符合条件的元素;注意:1. filter()不会对空数组进行检测;2. filter()不会改变源是数组;

解决使用Vue-Router出现无限循环问题

我在项目里面用到了的是全局守卫,beforeEach,方便管理 不过遇到了一个问题,就是在beforeEach()中设置好判断条件后出现了无限循环的问题 当时的代码如下:

Node.js事件循环

对于本文中一些知识点任然有些模糊,懵懵懂懂,一直都在学习中,通过学习事件循环也看了一些文献,在其中看到了这一句话:除了你的代码,一切都是同步的,我觉得很有道理,对于理解事件循环很有帮助。

关于for循环中使用setTimeout的四种解决方案

我们先来简单了解一下setTimeout延时器的运行机制。setTimeout会先将回调函数放到等待队列中,等待区域内其他主程序执行完毕后,按时间顺序先进先出执行回调函数。本质上是作用域的问题

Js循环的几种方法

for 常用于循环数组 ,for in 常用来循环对象,不建议循环数组,因为i是字符串 可能会有隐患问题,for in 循环会找到 prototype 上去,所以最好在循环体内加一个判断

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!