一文詳解如何跳出map或者foreach循環(huán)
更新時(shí)間：2023年11月21日 10:46:07 作者：牛牪犇0
javascript中的遍歷方法有很多,今天主要總結(jié)一下這些遍歷方法如何跳出循環(huán),這篇文章主要給大家介紹了關(guān)于如何跳出map或者foreach循環(huán)的相關(guān)資料,需要的朋友可以參考下
前言
forEach()和map() 是Array 數(shù)組對象提供的循環(huán)數(shù)組的方法。不能像js循環(huán)表達(dá)式那樣使用break 、‘continue’
等結(jié)束循環(huán)語句。
那么在forEach() 和 map()方法中如何終止循環(huán)和跳出本次循環(huán)呢？
跳出本地循環(huán)
在foreach和map函數(shù)里使用的 return 來實(shí)現(xiàn)跳出本次循環(huán)。以foreach 循環(huán)為例：
var arr = [1,2,3];
var newArr = []
arr.forEach((item,index) =>{
//下標(biāo)小于2時(shí)，直接return之后，不執(zhí)行后面的push。
if(index<2) {
return item
}
newArr.push(item)
})
console.log(newArr) // [3] //結(jié)果只有3
終止循環(huán)
在foreach和map函數(shù)里使用的 throw 拋出異常來實(shí)現(xiàn)跳出本次循環(huán)（強(qiáng)制退出，非必要不建議）。以foreach 循環(huán)為例：
var arr = [1,2,3]
var newArr = []
arr.forEach((item,index)=>{
try{
if(index > 1) {
throw new Error('文本小于2')
}
newArr.push(item)
}catch (e){
// throw e
}
})
console.log(newArr) [1,2]附：for循環(huán)里return和break的區(qū)別
1）return和break的應(yīng)用場景
- return只能在for循環(huán)外有一層作用域（通常是函數(shù)）的時(shí)候才能用，因?yàn)閒or循環(huán)自己是沒有作用域的。
- break外邊有沒有函數(shù)都可以，break只是針對該循環(huán)本身而言
2）return和break的使用區(qū)別（外層都有函數(shù)作用域）
- 單層循環(huán)：二者都可以跳出該函數(shù)
- 多層循環(huán)：
return 返回所有的for循環(huán)內(nèi)部結(jié)構(gòu) break 只跳出當(dāng)前的for循環(huán) // https://blog.csdn.net/weixin_38098192/article/details/84345494
總結(jié)
到此這篇關(guān)于如何跳出map或者foreach循環(huán)的文章就介紹到這了,更多相關(guān)跳出map或foreach循環(huán)內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
HTML+JavaScript實(shí)現(xiàn)筋斗云導(dǎo)航欄效果
這篇文章主要為大家介紹了如何利用HTML+JavaScript+CSS實(shí)現(xiàn)筋斗云導(dǎo)航欄效果，當(dāng)鼠標(biāo)經(jīng)過某個(gè)li，筋斗云跟著到當(dāng)前的位置，感興趣的小伙伴可以試一試2022-03-03
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)滑動(dòng)條案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
JS使用Promise時(shí)常見的5個(gè)錯(cuò)誤總結(jié)
Promise?提供了一種優(yōu)雅的方法來處理?JS?中的異步操作。這也是避免“回調(diào)地獄”的解決方案。然而，并沒有多少開發(fā)人員了解其中的內(nèi)容。因此，許多人在實(shí)踐中往往會(huì)犯錯(cuò)誤。在本文中，介紹一下使用?promise?時(shí)的五個(gè)常見錯(cuò)誤，希望大家能夠避免2022-11-11
在uni-app中，可以使用官方提供的uni-navigator組件來實(shí)現(xiàn)導(dǎo)航欄的功能，這篇文章主要介紹了uniapp導(dǎo)航欄組件如何使用,需要的朋友可以參考下2024-01-01
js的for in循環(huán)和java里foreach循環(huán)的區(qū)別分析
這篇文章主要介紹了js的for in循環(huán)和java里foreach循環(huán)的區(qū)別,實(shí)例分析了js的for in循環(huán)使用技巧并說明了與Java中foreach循環(huán)的使用區(qū)別,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01
一個(gè)JavaScript用逗號分割字符串實(shí)例
分割字符串的方法有很多，這篇文章主要介紹了一個(gè)JavaScript用逗號分割字符串實(shí)例，需要的朋友可以參考下2014-09-09
javascript concat數(shù)組累加使用實(shí)例。2009-09-09
在本篇文章里小編給大家整理了一篇關(guān)于js數(shù)組forEach實(shí)例用法詳解內(nèi)容，有需要的朋友們可以跟著學(xué)習(xí)參考下。2021-10-10
這篇文章主要為大家詳細(xì)介紹了JavaScript適配器模式的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-10-10
使用js實(shí)現(xiàn)將后臺(tái)傳入的json數(shù)據(jù)放在前臺(tái)顯示
今天小編就為大家分享一篇使用js實(shí)現(xiàn)將后臺(tái)傳入的json數(shù)據(jù)放在前臺(tái)顯示，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08