React前端js跳出ForEach循环的方式
<h1>React前端js跳出ForEach循环的方式</h1><p>今天踩了一个前端的坑。当forEach循环中满足某个条件时候就不在循环了。内心第一反应 添加return false 或 return 搞定~ 但是代码他依旧继续循环。</p>
<p>最后找到问题所在，forEach跳出的方法是throw err次才行，严格意义上说 map forEach 他们本身属于迭代行为 就不支持跳出的。当然这个throw err是使程序中断-跳出。</p>
<p>总结了一下跳出所有循环的方法：</p>
<h2>1.使用try catch 跳出forEach循环</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">try {
var array = ；
// 执行到第3次，结束循环
array.forEach((value)=>{
console.log("value---->",value);
if(value > 3){
throw new Error("抛出异常跳出")
}
});
} catch(e) {
console.log(e)
};</pre>
</div>
<h2>2. 跳出for循环(没有return方法)</h2>
<ul>
<li>break 跳出所有循环</li>
</ul>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">for(var i=1;i<=10;i++) {
if(i==8) {//等于8跳出
break;
}
console.log(i)
}
</pre>
</div>
<ul>
<li>continue 跳出当前循环，进入新的循环</li>
</ul>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">for(var i=1;i<=10;i++) {
if(i==8) {//等于8跳出
continue;
}
console.log(i)
}
</pre>
</div>
<h2>2.1.跳出 for in 循环(使用break)</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let arr =
for (let i inarr){
if(i > 3) {
break
}
console.log(arr) //1 2 3 4
}</pre>
</div>
<h2>3. every 当内部return false时跳出整个循环</h2>
<p>这个方法 说实在的我很少用 0-0 需要注意的是 <span style="color: rgba(255, 102, 0, 1)"><code>every虽然通过return false 可以跳出循环，但是循环里面你还是要写return true 让他持续循环 不然就只执行一次</code></span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">//every()当内部return false时跳出整个循环
let list = ;
list.every((value, index) => {
if(value > 3){
console.log(value)
return false;
}else{
console.log(value)
return true; //当然这边如果你不写这一行 她也会跳出的 就是上面说的return true为了让他进入下一次勋魂
}
});</pre>
</div>
<h2>4. some 当内部return true时跳出整个循环</h2>
<p>注意：<span style="color: rgba(255, 102, 0, 1)"><code>return true 跳出整个循环 。 如果return false 跳出本次循环 和上面for break和continue方法相似</code></span></p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let list3 = ;
list3.some((value, index) => {
if(value === 3){
return true;//当内部return true时跳出整个循环
}
console.log(value)// 1 2
});</pre>
</div>
<h2>5. ES6中 for of 跳出循环(使用break)</h2>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">let arr =
for (val of arr) {
if(val > 3 ){
break;
}
console.log("val===>",val) //1 23
}</pre>
</div>
<div> </div>
</div>
<div id="MySignature" role="contentinfo">
<div>作者：森林木马</div>
<div>出处：https://www.cnblogs.com/owenma/
</div>
<p>-------------------------------------------</p>
<p>特此声明：所有评论和私信都会在第一时间回复。也欢迎朋友们指正错误，共同进步！</p>
<p>如果觉得这篇文章对你有小小的帮助的话，记得在右下角点个<span>“推荐”</span>哦，博主在此感谢！</p>
<p></p>
<p>个性签名：好记性不如勤随笔，好随笔还请多关注！</p><br><br>
来源：https://www.cnblogs.com/owenma/p/13633667.html
頁:
[1]