forEach方法跳出循环

前文

没怎么理解JavaScript的forEach方法的童鞋使用forEach时很容易遇到一个问题就是,当你想要跳出这个循环时,发现returnbreak是不起作用的。下面我们来分析一下原因以及解决方法。

正文

首先我们要知道的是forEach方法的机制是对数组的每个有效元素执行一次callback函数,然后returnbreak等只作用于一个函数,也就造成了无法跳出forEach循环的问题,而是只能跳过当前函数的执行。

解决方案

曲线救国(SegmentFault

通过使用抛出异常的方式可以中止。

1
2
3
4
5
6
7
8
9
10
11
12
function foo(arr ,item){
var BreakException= {};

try {
arr.forEach(function(i) {
if(i === item) throw BreakException;
console.log(i);
});
} catch(e) {
if (e!==BreakException) throw e;
}
}

Array.some&Array.every

正常的使用环境:如果是测试一个数组里的元素是否符合某条件,且需要返回一个布尔值则应该使用这两个方法。这里可用于跳出循环。

1
2
3
4
5
6
function foo(arr ,item){
arr.some(function(i) {
if(i === item) return true;
console.log(i);
});
}

1
2
3
4
5
6
function foo(arr ,item){
arr.every(function(i) {
if(i === item) return false;
console.log(i);
});
}

循规蹈矩

如果你需要这样,使用forEach()方法是错误的,你可以用一个简单的循环作为替代。—— MDN
对于多重for循环,我们跳出循环需要特殊处理一下:

1
2
3
4
5
6
7
8
xh:	//首先将循环命名
for(var i=0;i<10;i++){
for(var j=0;j<5;j++){
if(i==3 && j==4){
break xh; //跳出循环xh
}
}
}

参考

  1. https://segmentfault.com/q/1010000003866554
  2. https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
-------------The End-------------

本文标题:forEach方法跳出循环

文章作者:Alvabill

发布时间:2018年03月11日 - 10:03

最后更新:2018年09月07日 - 13:09

原始链接:http://alvabill.ml/forEach方法跳出循环/

许可协议: 署名-非商业性使用-禁止演绎 4.0 国际 转载请保留原文链接及作者。