總結(jié)javascript中的六種迭代器
1.forEach迭代器
forEach方法接收一個(gè)函數(shù)作為參數(shù),對(duì)數(shù)組中每個(gè)元素使用這個(gè)函數(shù),只調(diào)用這個(gè)函數(shù),數(shù)組本身沒有任何變化
//forEach迭代器 function square(num){ document.write(num + ' ' + num*num + '<br>'); } var nums = [1,2,3,4,5,6,7,8]; nums.forEach(square);
在瀏覽器中輸出的結(jié)果是:
2.every迭代器
every方法接受一個(gè)返回值為布爾類型的函數(shù),對(duì)數(shù)組中的每個(gè)元素使用這個(gè)函數(shù),如果對(duì)于所有的元素,該函數(shù)均返回true,則該方法返回true,否則返回false
//every迭代器 function isEven(num){ return num % 2 == 0; } var nums = [2,4,6,8]; document.write(nums.every(isEven));
3.some迭代器
some方法也是接受一個(gè)返回值為布爾類型的函數(shù),只要有一個(gè)元素使得該函數(shù)返回true,該方法就返回true
//some迭代器 function isEven(num){ return num % 2 == 0; } var nums = [1,3,5,7]; document.write(nums.some(isEven));
4.reduce迭代器
reduce方法接受一個(gè)函數(shù),返回一個(gè)值,該方法從一個(gè)累加值開始,不斷對(duì)累加值和數(shù)組中的后續(xù)元素調(diào)用該函數(shù),知道數(shù)組中最后一個(gè)元素,最后得到返回的累加值
//reduce迭代器 function add(runningTotal, currentValue){ return runningTotal + currentValue; } var nums = [1,2,3,4,5,6,7,8,9,10]; var sum = nums.reduce(add); document.write(sum);
得到的結(jié)果是:55
reduce()
函數(shù)和add()
函數(shù)一起,從左到右,一次對(duì)數(shù)組中的元素求和,執(zhí)行過程如下:
add(1,2) -> 3 add(3,3) -> 6 add(6,4) -> 10 add(10,5) -> 15 add(15,6) -> 21 add(21,7) -> 28 add(28,8) -> 36 add(36,9) -> 45 add(45,10) -> 55
reduce
方法也可以用來將數(shù)組中的元素鏈接成一個(gè)長的字符串,代碼如下
//使用reduce連接數(shù)組元素 function concat(accumulatedString, item){ return accumulatedString + item; } var words = ['the ', 'quick ', 'brown ', 'fox']; var sentence = words.reduce(concat); document.write(sentence);
最后輸出結(jié)果如下:
javascript還提供了reduceRight
方法,和Reduce
方法不同,它是從右到左執(zhí)行,如下:
//使用reduce連接數(shù)組元素 function concat(accumulatedString, item){ return accumulatedString + item; } var words = ['the ', 'quick ', 'brown ', 'fox ']; var sentence = words.reduceRight(concat); document.write(sentence);
執(zhí)行結(jié)果如下:
5.map迭代器
map迭代器和forEach有些類似,但是map會(huì)改變數(shù)組,生成新的數(shù)組,如下代碼
//使用map迭代器生成新的數(shù)組 function curve(grade){ return grade+5; } var grades = [77,65,81,92,83]; var newgrades = grades.map(curve); document.write(newgrades);
輸出結(jié)果:
6.fiter迭代器
和every迭代器類似,傳入一個(gè)返回值為布爾類型的函數(shù),和every
方法不同的是,當(dāng)數(shù)組中所有元素對(duì)應(yīng)該函數(shù)返回的結(jié)果均為true時(shí),該方法并不返回true,而是返回一個(gè)新的數(shù)組,該數(shù)組包含對(duì)應(yīng)函數(shù)返回結(jié)果為true的元素,代碼如下
function isEven(num){ return num % 2 == 0; } function isOdd(num){ return num % 2 != 0; } var nums = []; for (var i=0; i<20; i++) { nums[i] = i+1; } var evens = nums.filter(isEven); document.write(evens); document.write('<br>'); var odds = nums.filter(isOdd); document.write(odds);
輸出結(jié)果如下:
總結(jié)
以上就是關(guān)于javascript中的六種迭代器的總結(jié),希望本文的內(nèi)容對(duì)大家學(xué)習(xí)工作能有所幫助。
相關(guān)文章
JavaScript實(shí)現(xiàn)讀取與輸出XML文件數(shù)據(jù)的方法示例
這篇文章主要介紹了JavaScript實(shí)現(xiàn)讀取與輸出XML文件數(shù)據(jù)的方法,結(jié)合實(shí)例形式分析了JavaScript基于ActiveXObject實(shí)現(xiàn)載入、讀取與輸出xml文件數(shù)據(jù)的相關(guān)操作技巧,需要的朋友可以參考下2018-06-06typeScript?核心基礎(chǔ)之接口interface
本篇文章主要介紹?typeScript?中接口是啥?如何定義的?接口是如何進(jìn)行擴(kuò)展的以及類如何實(shí)現(xiàn)接口,接下來和小編一起進(jìn)入下面文章一起學(xué)習(xí)?typeScript?接口2022-02-02js的壓縮及jquery壓縮探討(提高頁面加載性能/保護(hù)勞動(dòng)成果)
搞定js的加密和壓縮,一方面可以提高頁面加載性能,另外一方面也希望辛苦研發(fā)出來的成果得到一定的保護(hù),感興趣的朋友可以了解下,或許對(duì)你有所幫助2013-01-01不刷新網(wǎng)頁就能鏈接新的js文件方法總結(jié)
在本篇文章里小編給大家整理的是關(guān)于不刷新網(wǎng)頁就能鏈接新的js文件方法總結(jié),需要的朋友們參考下。2020-03-03不使用XMLHttpRequest實(shí)現(xiàn)異步加載 Iframe和script
運(yùn)用Iframe和script可以實(shí)現(xiàn)簡單的異步加載,沒有使用XMLHttpRequest,需要的朋友可以參考下2012-10-10Pro JavaScript Techniques學(xué)習(xí)筆記
Pro JavaScript Techniques學(xué)習(xí)筆記,學(xué)習(xí)js的朋友可以參考下。2010-12-12