JavaScript 中 for、forEach 及 jQuery each 循环的跳出机制详解

作者:青柠

时间:2026-10-25

浏览:498

本文详细解析 JavaScript 中 for、for-in、jQuery each 及 forEach 四种常见循环结构的跳出方式。重点对比了 break、continue 以及 return true/false 在不同循环中的行为差异,特别指出 forEach 无法通过 return 直接终止整体循环,需借助异常处理机制实现完全退出。

文章目录

在 JavaScript 开发中,循环结构是处理数据集的基础工具。本文旨在梳理并总结几种主流循环结构中实现“跳出”或“终止”执行的具体方法。

1. for 循环

var arr = ['q','w','e','r','t'];
for(var i=0, len = arr.length ; i< len ; i++){
console.log(arr[i]);
}
 
// q , w , e , r , t

使用 continue 关键字可跳过当前迭代:

for(var i=0, len = arr.length ; i< len ; i++){
if(i == 2){
continue;
}
console.log(arr[i]);
}
 
// q , w , r , t

当变量 i 等于 2 时,执行 continue 将跳过本次循环剩余代码,但循环本身不会终止,而是继续判断条件并执行后续迭代,直至条件为 false。

使用 break 关键字可终止整个循环:

for(var i=0, len = arr.length ; i< len ; i++){
if(i == 2){
break;
}
console.log(arr[i]);
}
 
// q , w

当 i 等于 2 时,执行 break 会立即中断整个循环结构,不再执行后续任何迭代条件判断,直接退出循环体。

2. for-in 循环

其退出机制与标准 for 循环一致,同样支持使用 break 和 continue 控制流程。

3. jQuery 的 each 循环

$.each(arr,function(index,oo){
console.log(oo);
})
//q , w , e , r , t

在 jQuery each 中,返回 true 用于跳过当前迭代:

$.each(arr,function(index,oo){
if(index == 2){
return true;
}
console.log(oo);
})
//q ,w ,r ,t

当索引 index 等于 2 时,返回 true 会跳过当前元素的后续处理代码,但循环会继续执行剩余元素。

返回 false 用于终止整个循环:

$.each(arr,function(index,oo){
if(index == 2){
return false;
}
console.log(oo);
});
 
// q , w

当 index 等于 2 时,返回 false 会立即终止整个 each 循环,后续元素不再被遍历。

4. Array.prototype.forEach 循环

arr.forEach(function(oo,index){
console.log(oo);
});
 
// q, w, e, r, t

在 forEach 中,无论返回什么值(包括 return、return false 或 return true):

arr.forEach(function(oo,index){
if(index == 2){
return ;
//return false; //效果同上
// return true; //效果同上
}
console.log(oo);
});
// q , w ,r ,t

这些返回值仅能跳过当前迭代中 return 之后的代码,无法终止整个 forEach 循环,循环仍会遍历所有元素。

若需强行跳出整个 forEach 循环,可采用抛出异常的方式:

try{
arr.forEach(function(oo,index){
if(index == 2){
throw 'jumpout';
}
console.log(oo);
});
}catch(e){
}
 
// q , w

以上内容涵盖了 JavaScript 主要循环结构的退出逻辑,希望能为读者的编程实践提供参考与帮助。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章