JavaScript中遍历跳出循环方法总结
作者:@德玛玩前端
这篇文章主要给大家介绍了关于JavaScript中遍历跳出循环方法的相关资料,一想到想到循环的跳出,立马就会想到三个关键,break、return、continue,在业务中也会需要在遍历的时候退出循环,需要的朋友可以参考下
前言
javascript中的遍历方法有很多,今天,主要总结一下这些遍历方法如何跳出循环,欢迎各位大神和同行们指教和修正😁
首先,必须要知道的是:
- return必须是使用在函数里面的
- return有2个作用,结束函数和返回结果
JS中的遍历有如下方式可以跳出循环
1.for方法 跳出循环
- break 跳出当前循环,循环后面的代码仍然可以执行
- return 可以终止当前函数,循环后面的代码不可以执行
- continue 跳过当次循环,仍然执行后续的循环
function a(){ var arr = [1,3,5,7,9]; var id = 5; for (var i = 0; i < arr.length; i++) { if(arr[i]=== 1) continue; //跳过当次循环 console.log(arr[i]) if (arr[i] === id) { break; //满足条件,跳出循环;循环后面的代码仍然可以执行 } if (arr[i] === 6) { return; //满足条件,可以终止当前函数 } } }
2.forEach方法跳出循环
- 无法使用break,continue来跳出遍历, 因为foreach是异步执行,可能在break之前代码就已经执行完了
- forEach()本身无法跳出循环,必须遍历所有的数据才能结束
- 通过抛出异常的方式跳出循环 实现break效果
// 在forEach中,无法用break等函数在遍历结束之前结束遍历,如果要提前终止,必须把forEach()方法放在一个try块中,并能抛出一个异常。 var arr = [1,3,5,7,9]; var id = 5; try { arr.forEach(function (curItem, i) { if(curItem === 1) return; console.log(curItem) if (curItem === id) { throw Error(); //满足条件,跳出循环 } }) } catch (e) { }
- 通过return跳过当次循环 实现continue的效果
arr.forEach(function (curItem, i) { if(curItem === 1) return; console.log(curItem) if (curItem === id) { return; //满足条件,跳出当次循环 // break 语法报错; } })
3. map() 跳出循环
- map和forEach一样无法通过break跳出循环。
- map() 和 forEach()的区别
// 前者不改变原数组的内容 // 后者改变原数组的内容
4. for of 跳出循环
- continue 跳出当次循环
for (let i of arr) { if (i === 3) { continue } console.log(i) }
- break 跳出当前循环
for (let i of arr) { if (i === 3) { break } console.log(i) }
- return 可以终止当前函数,循环后面的代码不可以执行
var a=[1,2,3,4]; function b(){ for(var key of a){ if(key=2){ return false }; console.log('哈哈哈')} }; console.log(b()) //false
5. while do while 跳出循环
- continue 跳出当次循环
let j = 1 while (j < 6) { if (j === 3) { j++ continue } console.log(j) // 1 2 4 5 j++ }
- break 跳出当前循环
var i=0; while (i < 6) { if (i === 3) { i++ break } console.log(i) // 0,1,2 i++ }
- return 可以终止当前函数,循环后面的代码不可以执行
var i=0; while (i < 6) { if (i === 3) { return } console.log(i) i++ }
every 遍历
- every可以通过return的返回bool值,控制是否继续遍历。
let arr = [1, 2, 3, 4, 5] arr.every(i => { console.log(i) return true //1,2,3,4,5 }) arr.every(i => { console.log(i) if (i === 3) { return false //1,2,3 } else { return true } })
some 遍历
- some 可以通过控制return true来结束遍历。
- 如果没有写return,会遍历到最后一个值,默认给true关闭
let arr = [1, 2, 3, 4, 5] arr.some(i => { console.log(i) // 1,2,3,4,5 }) arr.some(i => { console.log(i) if (i === 3) { return true //1,2,3 } }) }
总结
到此这篇关于JavaScript中遍历跳出循环方法总结的文章就介绍到这了,更多相关JS遍历跳出循环内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!