js中foreach不可break和return JavaScript循环

一、问题场景

前端在js里对页面必填项进行校验，如果不满足条件则return。js代码如下图

var lastAddress = ["街","路","村","乡","镇","道"];
var value = outInvoiceSpeElement[vm.needAttr[i].attrId];
var validFlag = false;

lastAddress.forEach(function(addressPart, index) {
	if(!value.includes(addressPart)){
		validFlag = true;
		break;
	}
});

if(validFlag){
	alert("不动产地址 必须包含“街、路、村、乡、镇、道”关键词。");
	return;
}

但是break失效，搜了下才知道，forEach 循环无法中途跳出，break 命令或 return 命令都不能奏效。

二、foreach的特点

1、forEach只能默认从索引0开始。

2、for循环过程中支持修改索引（修改 i），但forEach做不到（底层控制index自增，我们无法左右它）

3、await 不能用在 forEach 中：原因：那就是 forEach 只支持同步代码。

4、forEach 循环无法中途跳出，break 命令或 return 命令都不能奏效。

5、遍历数组删除元素不方便。可以参考该博客最后部分实现，不过有点麻烦Js中foreach()用法及使用的坑_js foreach-CSDN博客

用法：

var arr = [1,2,3,4];
var sum =0;
arr.forEach(function(value,index,array){
 array[index] == value; //输出结果为 true
 sum+=value; 
 });
console.log(sum); 
//输出结果 10

三、可以通过try catch方法跳出循环

let arr = [1,2,3,4,5,6,7,8,9];
let num = 6
try {
     arr.forEach((item, i)=> {        
         console.log('item',item)
         if (item === num) {
             throw new Error('LoopInterrupt');         //满足条件，跳出循环
         }
     })
 } catch (e) {
   if (e.message !== "LoopInterrupt") throw e
}
console.log(123)

四、参考博客

JavaScript 中forEach()的用法_foreach()里面不能用let-CSDN博客

JavaScript foreach 方法跳出循环_js foreach跳出循环-CSDN博客

JS中循环遍历数组的几种常用方式总结_js循环数组-CSDN博客

Js中foreach()用法及使用的坑_js foreach-CSDN博客

刨析 JS 中的forEach、for in、for of三类循环原理和性能_js for foreach性能-CSDN博客

24种 JavaScript 循环遍历方法_javascript foreach-CSDN博客