js數(shù)組forEach實(shí)例用法詳解
1、forEach()類似于map(),它還將每個(gè)元素依次作用于傳入函數(shù),但不會(huì)返回新的數(shù)組。
2、forEach()常用于遍歷數(shù)組,用于調(diào)用數(shù)組的每一個(gè)元素,并將其傳遞給回調(diào)函數(shù)。傳輸函數(shù)不需要返回值。
實(shí)例
var arr=[7,4,6,51,1]; try{arr.forEach((item,index)=>{ if (item<5) { throw new Error("myerr")//創(chuàng)建一個(gè)新的error message為myerr } console.log(item)//只打印7 說明跳出了循環(huán) })}catch(e){ console.log(e.message); if (e.message!=="myerr") {//如果不是咱們定義的錯(cuò)誤扔掉就好啦 throw e } }
知識(shí)點(diǎn)擴(kuò)展:
手寫 forEach
forEach()
方法對(duì)數(shù)組的每個(gè)元素執(zhí)行一次提供的函數(shù)
arr.forEach(callback(currentValue [, index [, array]])[, thisArg]);
-
callback
- currentValue
數(shù)組中正在處理的當(dāng)前元素。 - index 可選
數(shù)組中正在處理的當(dāng)前元素的索引。 - array 可選
forEach() 方法正在操作的數(shù)組。 - thisArg 可選
可選參數(shù)。當(dāng)執(zhí)行回調(diào)函數(shù) callback 時(shí),用作 this 的值。
- currentValue
- 沒有返回值
如果提供了一個(gè) thisArg 參數(shù)給 forEach
函數(shù),則參數(shù)將會(huì)作為回調(diào)函數(shù)中的 this
值。否則 this
值為 undefined。回調(diào)函數(shù)中 this
的綁定是根據(jù)函數(shù)被調(diào)用時(shí)通用的 this
綁定規(guī)則來決定的。
let arr = [1, 2, 3, 4]; arr.forEach((...item) => console.log(item)); // [1, 0, Array(4)] 當(dāng)前值
function Counter() { this.sum = 0; this.count = 0; } // 因?yàn)?thisArg 參數(shù)(this)傳給了 forEach(),每次調(diào)用時(shí),它都被傳給 callback 函數(shù),作為它的 this 值。 Counter.prototype.add = function(array) { array.forEach(function(entry) { this.sum += entry; ++this.count; }, this); // ^---- Note }; const obj = new Counter(); obj.add([2, 5, 9]); obj.count; // 3 === (1 + 1 + 1) obj.sum; // 16 === (2 + 5 + 9)
- 每個(gè)數(shù)組都有這個(gè)方法
- 回調(diào)參數(shù)為:每一項(xiàng)、索引、原數(shù)組
Array.prototype.forEach = function(fn, thisArg) { var _this; if (typeof fn !== "function") { throw "參數(shù)必須為函數(shù)"; } if (arguments.length > 1) { _this = thisArg; } if (!Array.isArray(arr)) { throw "只能對(duì)數(shù)組使用forEach方法"; } for (let index = 0; index < arr.length; index++) { fn.call(_this, arr[index], index, arr); } };
到此這篇關(guān)于js數(shù)組forEach實(shí)例用法詳解的文章就介紹到這了,更多相關(guān)js數(shù)組forEach方法的使用內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Angularjs結(jié)合Bootstrap制作的一個(gè)TODO List
這篇文章主要介紹了Angularjs結(jié)合Bootstrap制作的一個(gè)TODO List 的相關(guān)資料,感興趣的小伙伴們可以參考一下2016-08-08javascript 數(shù)據(jù)結(jié)構(gòu)的題
面試題是3個(gè)數(shù)據(jù)結(jié)構(gòu)的題,可以用java/c/c++/python實(shí)現(xiàn),靠,js也能實(shí)現(xiàn),鄙視js?我上機(jī)就用js寫的,雖說肯定沒戲,但js我挺。2008-07-07淺談JavaScript 函數(shù)參數(shù)傳遞到底是值傳遞還是引用傳遞
下面小編就為大家?guī)硪黄獪\談JavaScript 函數(shù)參數(shù)傳遞到底是值傳遞還是引用傳遞。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-08-08js實(shí)現(xiàn)首屏延遲加載實(shí)現(xiàn)方法 js實(shí)現(xiàn)多屏單張圖片延遲加載效果
這篇文章主要介紹了js實(shí)現(xiàn)首屏延遲加載實(shí)現(xiàn)方法,以及js實(shí)現(xiàn)多屏單張圖片延遲加載效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07關(guān)于JSON解析的實(shí)現(xiàn)過程解析
這篇文章主要介紹了關(guān)于JSON解析的實(shí)現(xiàn)過程解析,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-10-10