foreach无法 return 如何中断foreach循环

最新推荐文章于 2024-06-20 15:56:02 发布

原创最新推荐文章于 2024-06-20 15:56:02 发布 · 7.1k 阅读

11 ·

CC 4.0 BY-SA版权

文章标签：

#foreach #中断foreach循环 #try...catch #数组 #es6

javascript 专栏收录该内容

15 篇文章

订阅专栏

本文详细探讨了JavaScript中数组的forEach方法的使用限制，包括无法通过break或continue控制流程，以及return语句不能终止循环的特点。同时介绍了如何利用try...catch、Array.some()和Array.every()等替代方案实现循环控制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

数组的 forEach 用于循环遍历数据，会对数组中有效的每一项执行一次回调函数，但是在遍历回调中使用 break 或 continue 会报错，使用 return 也无法终止循环。

语法

Array.forEach((currentValue, index, array, thisArg) => {})

currentValue: 数组中正在处理的当前元素。
index(可选): 数组中正在处理的当前元素的索引。
array(可选): forEach() 方法正在操作的数组。
thisArg(可选): 当执行回调函数时用作 this 的值(参考对象)。

使用 break

let arr = [1, 2, 3]
arr.forEach(item => {
	if (item === 2) {
		break // 报错
	}
	console.log(item)
})

在这里插入图片描述

使用 continue

let arr = [1, 2, 3]
arr.forEach(item => {
	if (item === 2) {
		continue // 报错
	}
	console.log(item)
})

在这里插入图片描述

使用 return

let arr = [1, 2, 3]
arr.forEach(item => {
    if (item === 2) {
    	return
    }
    console.log(item)
})

在这里插入图片描述
从图中可以看出 return 并没有终止 forEach 循环，还是继续循环打印出了 3 。

使用try…catch来终止循环

let arr = [1, 2, 3]
try {
	arr.forEach(item => {
		if (item === 2) {
			throw('循环终止')
		}
		console.log(item)
	})
} catch(e) {
	console.log('e: ', e)
}

在这里插入图片描述
从图中可以看到，当循环到第二项时抛出了错误，从而使得forEach没有再进行下去

使用其他语法代替

// 使用 Array.some()
arr.some(item => {
	console.log('b: ',item) 
	return item === 2 // 当有数组有一项满足条件时结束并返回true
})

// 使用 Array.ervey()
arr.every(item => {
	console.log('c: ',item)
	return item !== 2 // 检查数字中是否每一项都满足条件，如果有一项不满足就结束循环并返回false
})