js中forEach的用法之forEach與for之間的區(qū)別
一、定義和用法
forEach()
調用數(shù)組的每個元素,并將元素傳遞給回調函數(shù)。
- 注意:
forEach()
對于空數(shù)組是不會執(zhí)行回調函數(shù)的。
用法:
array.forEach(function(currentValue, index, arr), thisValue)
1==> currentValue
必需。當前元素2==> index
可選。當前元素的索引值,是數(shù)字類型的3==> arr
可選。當前元素所屬的數(shù)組對象4==>
可選。傳遞給函數(shù)的值一般用 "this" 值。
如果這個參數(shù)為空, "undefined
" 會傳遞給 "this" 值
forEach 的注意點:
forEach()
本身是不支持的continue
與break
語句的。- 我們可以通
return
語句實現(xiàn)continue
關鍵字的效果
二、運用場景
1.運用的場景(計算數(shù)字之和)
計算數(shù)組所有元素相加的總和:
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; let sum = 0; arr.forEach((currentIndex, index, curArr) => { sum += currentIndex // sum=sum+currentIndex }) console.log('之和是', sum);
2.運用的場景(給原始數(shù)組新增key值)
//給原始數(shù)組的每一項新增一個屬性值 let arr = [{ id: '001', name: '張三1' }, { id: '002', name: '張三2' }, { id: '003', name: '張三2' }]; //給原始數(shù)組的每一項新增一個屬性值 arr.forEach((item, index) => { item['addAttrs'] = '' }) console.log('arr', arr); --使用for of來出處理-- for (let item of arr) { item['index'] = '' } console.log('arr', arr);
三、forEach 跳出循環(huán)
1.forEach 跳出當前的循環(huán) return
//內容為3,不遍歷該項 var arr = [1, 2, 3]; arr.forEach(function(item) { if (item === 3) { return; } console.log(item); });
2.forEach結合try跳出整個循環(huán)
- 找到id為002,然后終止整個循環(huán),返回當前這一項的值。
- 使用
try-catch
完成的
代碼如下:
let arr = [{ id: '001', name: '張三1' }, { id: '002', name: '張三2' }, { id: '003', name: '張三2' }]; // 使用forEach跳出整個循環(huán),使用rty-catch function useForeach(Arr) { let obj = {} try { Arr.forEach(function(item) { if (item.id == '002') { // 找到目標項,賦值。然后拋出異常 obj = item throw new Error('return false') } }); } catch (e) { // 返回id===002的這一項的數(shù)據(jù) return obj } } console.log(useForeach(arr))
3.forEach 與for循環(huán)的區(qū)別 【面試題】
1==> for
可以用continue跳過當前循環(huán)中的一個迭代,forEach 用continue會報錯。但是可以使用return來跳出當前的循環(huán)2==> for
可以使用break來跳出整個循環(huán),forEach正常情況無法跳出整個循環(huán)。
如果面試官問:如果非要跳出forEach中的循環(huán),可以拋出一個異常來處理
到此這篇關于js中forEach的用法之forEach與for之間的區(qū)別的文章就介紹到這了,更多相關js forEach與fo的區(qū)別內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
微信小程序開發(fā)之實現(xiàn)自定義Toast彈框
Toast相信對于利用微信小程序開發(fā)的朋友們來說都不陌生,有時候官方的樣式并不能滿足業(yè)務要求,怎么辦呢,當然有解決辦法了。有一個插件可以直接幫我們完成WeToast,這篇文章主要給大家介紹了微信小程序開發(fā)之實現(xiàn)自定義Toast彈框的相關資料,需要的朋友可以參考下。2017-06-06微信小程序跨頁面數(shù)據(jù)傳遞事件響應實現(xiàn)過程解析
這篇文章主要介紹了微信小程序跨頁面數(shù)據(jù)傳遞事件響應實現(xiàn)過程解析,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-12-12CocosCreator Typescript制作俄羅斯方塊游戲
目前關于cocos開發(fā)俄羅斯方塊的文章幾乎寥寥無幾,因此本文將主要介紹如何通過CocosCreator Typescript制作簡單的俄羅斯方塊游戲,代碼具有一定價值,感興趣的同學可以學習一下2021-11-11不得不分享的JavaScript常用方法函數(shù)集(上)
不得不分享的JavaScript常用方法函數(shù)集,幫助大家更好的學習javascript程序設計,有興趣的朋友可以參考一下2015-12-12