JavaScript數(shù)組中的迭代和歸并方法

迭代方法

ECMAScript 5為數(shù)組定義了5個(gè)迭代方法。每個(gè)方法都接受兩個(gè)參數(shù):要在每一項(xiàng)上運(yùn)行的函數(shù)和(可選的)運(yùn)行該函數(shù)的作用域?qū)ο?影響this的值烤黍。傳入這些方法中的函數(shù)會(huì)接收三個(gè)參數(shù):數(shù)組項(xiàng)的值吭净、該項(xiàng)在數(shù)組中的位置和數(shù)組對(duì)象本身。根據(jù)使用的方法不同,這個(gè)函數(shù)執(zhí)行后的返回值可能會(huì)也可能不會(huì)影響方法的返回值找田。以下是5個(gè)迭代方法的作用不恭。

方法名 作用
every() 對(duì)數(shù)組中每一項(xiàng)都運(yùn)行該函數(shù)叶雹,如果該函數(shù)對(duì)每一項(xiàng)都返回true,則返回true
filter() 對(duì)數(shù)組中每一項(xiàng)都運(yùn)行該函數(shù)换吧,返回該函數(shù)會(huì)返回true的項(xiàng)組成的數(shù)組
forEach() 對(duì)數(shù)組中每一項(xiàng)都運(yùn)行該函數(shù)折晦,該方法沒(méi)有返回值
map() 對(duì)數(shù)組中每一項(xiàng)都運(yùn)行該函數(shù),返回每次函數(shù)調(diào)用的結(jié)果組成的數(shù)據(jù)
some() 對(duì)數(shù)組中每一項(xiàng)都運(yùn)行該函數(shù)沾瓦,如果該函數(shù)對(duì)任一項(xiàng)返回true满着,則返回true

以上方法都不會(huì)修改數(shù)組中包含的值谦炒。
注意:

1. every()和some()

every()和some()方法最相似,every()執(zhí)行的時(shí)候风喇,若數(shù)組中每一項(xiàng)都返回true宁改,則返回true,否則返回false魂莫,而some()方法執(zhí)行時(shí)还蹲,只要數(shù)組中有一項(xiàng)返回true,則結(jié)果就返回true耙考。舉例如下:

 var values = [5, 6, 7, 8, 9, 8, 7, 6, 5];
 var everyResult = values.every(function(item, index, array) {
     return (item > 6);
 });
 alert(everyResult);//false
 var someValue = values.some(function(item, index, array) {
     return (item > 6);
 });
 alert(someValue);//true

以上代碼調(diào)用了every()和some()函數(shù)谜喊,傳入的函數(shù)只要給定項(xiàng)大于6就返回true。every()函數(shù)返回false倦始,因?yàn)橹挥胁糠謹(jǐn)?shù)組項(xiàng)符合條件斗遏。對(duì)于some(),結(jié)果就是true鞋邑,因?yàn)橹辽儆幸豁?xiàng)是大于6最易。

2. filter()

filter()函數(shù)利用指定的函數(shù)確定是否在數(shù)組中包含某一項(xiàng)。例如要返回一個(gè)所有值都大于6的數(shù)組炫狱,可以如下使用:

var values = [5, 6, 7, 8, 9, 8, 7, 6, 5];
var filterResult = values.filter(function(item, index, array) {
    return (item > 6);
});
alert(filterResult);//[7,8,9, 8, 7]

filter方法對(duì)查詢(xún)符合某些條件的所有數(shù)據(jù)非常又用藻懒。

3. map()

map()函數(shù)也返回一個(gè)數(shù)據(jù),而這個(gè)數(shù)據(jù)的每一項(xiàng)都實(shí)在原始數(shù)據(jù)中的對(duì)應(yīng)項(xiàng)上運(yùn)行傳入函數(shù)的結(jié)果视译。例如嬉荆,要給數(shù)據(jù) 中每一項(xiàng)乘以2,然后返回這些乘積組成的數(shù)據(jù)酷含,則可以用如下方法實(shí)現(xiàn):

var values = [5, 6, 7, 8, 9, 8, 7, 6, 5];
var mapResult = values.map(function(item, index, array) {
    return item * 2;
});
alert(mapResult);//[10,12,14,16,18,16,14,12,10]

map()方法適合創(chuàng)建包含的項(xiàng)與另一個(gè)數(shù)組一一對(duì)應(yīng)的數(shù)據(jù)鄙早。

4.forEach()

對(duì)數(shù)組中每一項(xiàng)運(yùn)行傳入的函數(shù),這個(gè)函數(shù)沒(méi)有返回值椅亚,本質(zhì)上與for循環(huán)迭代數(shù)據(jù)一樣限番。

var values = [5, 6, 7, 8, 9, 8, 7, 6, 5];
var forEachResult = values.forEach(function(item, index, array) {
    //執(zhí)行某些操作
});

通過(guò)迭代方法,可以大大方便處理數(shù)組的任務(wù)呀舔。

歸并方法

ECMAScript5還有兩個(gè)歸并數(shù)組的方法:reduce()和reduceRight()弥虐。這兩個(gè)方法都會(huì)迭代數(shù)組的所有項(xiàng),然后構(gòu)建一個(gè)最終返回的值媚赖。其中reduce()方法從數(shù)據(jù)第一項(xiàng)開(kāi)始霜瘪,逐個(gè)遍歷到最后,reduceRight()則從數(shù)據(jù)最后哦一項(xiàng)開(kāi)始惧磺,向前遍歷到第一項(xiàng)颖对。
這兩個(gè)方法都接收兩個(gè)參數(shù):一個(gè)在每一項(xiàng)上調(diào)用的函數(shù)和(可選)作為歸并基礎(chǔ)的初始值。傳給reduce()和reduceRight()的函數(shù)接收4個(gè)參數(shù):前一個(gè)值磨隘、當(dāng)前值缤底、項(xiàng)的索引和數(shù)組對(duì)象顾患。這個(gè)函數(shù)返回的任何值都會(huì)作為參數(shù)自動(dòng)傳遞給下一項(xiàng)。第一次迭代發(fā)生在數(shù)組的第二項(xiàng)上个唧,因此第一個(gè)參數(shù)是數(shù)組的第一項(xiàng)江解,第二個(gè)參數(shù)是數(shù)組的第二項(xiàng)。

var numbers = [5,4,3,2,1];
var reduceResult = numbers.reduce(function(preVal, currVal, index, array) {
    return preVal + currVal;
});
alert(reduceResult);//15

第一次執(zhí)行回調(diào)函數(shù)坑鱼,preVal是5膘流,currVal是4絮缅,第二次preVal是9鲁沥,currVal是3,該過(guò)程持續(xù)到數(shù)組便利完耕魄,最后返回結(jié)果画恰。
reduceRight()作用類(lèi)似,只不過(guò)方向相反而已吸奴。

var numbers = [5,4,3,2,1];
var reduceResult = numbers. reduceRight(function(preVal, currVal, index, array) {
    return preVal + currVal;
});
alert(reduceResult);//15

使用時(shí)候選擇reduce()還是reduceRight()主要取決于從哪頭開(kāi)始遍歷數(shù)組允扇,除此之外,他們完全相同则奥。

》》》不忘初心考润,繼續(xù)前進(jìn)!》》》

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末读处,一起剝皮案震驚了整個(gè)濱河市糊治,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌罚舱,老刑警劉巖井辜,帶你破解...
    沈念sama閱讀 217,826評(píng)論 6 506
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異管闷,居然都是意外死亡粥脚,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,968評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén)包个,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)刷允,“玉大人,你說(shuō)我怎么就攤上這事碧囊∈扬保” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 164,234評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵呕臂,是天一觀的道長(zhǎng)破托。 經(jīng)常有香客問(wèn)我,道長(zhǎng)歧蒋,這世上最難降的妖魔是什么土砂? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,562評(píng)論 1 293
  • 正文 為了忘掉前任州既,我火速辦了婚禮,結(jié)果婚禮上萝映,老公的妹妹穿的比我還像新娘吴叶。我一直安慰自己,他們只是感情好序臂,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,611評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布蚌卤。 她就那樣靜靜地躺著,像睡著了一般奥秆。 火紅的嫁衣襯著肌膚如雪逊彭。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 51,482評(píng)論 1 302
  • 那天构订,我揣著相機(jī)與錄音侮叮,去河邊找鬼。 笑死悼瘾,一個(gè)胖子當(dāng)著我的面吹牛囊榜,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播亥宿,決...
    沈念sama閱讀 40,271評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼卸勺,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了烫扼?” 一聲冷哼從身側(cè)響起曙求,我...
    開(kāi)封第一講書(shū)人閱讀 39,166評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎材蛛,沒(méi)想到半個(gè)月后圆到,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,608評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡卑吭,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,814評(píng)論 3 336
  • 正文 我和宋清朗相戀三年芽淡,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片豆赏。...
    茶點(diǎn)故事閱讀 39,926評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡挣菲,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出掷邦,到底是詐尸還是另有隱情白胀,我是刑警寧澤,帶...
    沈念sama閱讀 35,644評(píng)論 5 346
  • 正文 年R本政府宣布抚岗,位于F島的核電站或杠,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏宣蔚。R本人自食惡果不足惜向抢,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,249評(píng)論 3 329
  • 文/蒙蒙 一认境、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧挟鸠,春花似錦叉信、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,866評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至覆享,卻和暖如春佳遂,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背淹真。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 32,991評(píng)論 1 269
  • 我被黑心中介騙來(lái)泰國(guó)打工讶迁, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留连茧,地道東北人核蘸。 一個(gè)月前我還...
    沈念sama閱讀 48,063評(píng)論 3 370
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像啸驯,于是被迫代替她去往敵國(guó)和親客扎。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,871評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容

  • 第5章 引用類(lèi)型(返回首頁(yè)) 本章內(nèi)容 使用對(duì)象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類(lèi)型 使用基本類(lèi)型...
    大學(xué)一百閱讀 3,233評(píng)論 0 4
  • 數(shù)組是值的有序集合罚斗。每個(gè)值叫做一個(gè)元素徙鱼,而每個(gè)元素在數(shù)組中有一個(gè)位置,以數(shù)字表示针姿,稱(chēng)為索引袱吆。 JavaScript...
    劼哥stone閱讀 1,130評(píng)論 6 20
  • 本章內(nèi)容 使用對(duì)象 創(chuàng)建并操作數(shù)組 理解基本的 JavaScript 類(lèi)型 使用基本類(lèi)型和基本包裝類(lèi)型 引用類(lèi)型的...
    悶油瓶小張閱讀 681評(píng)論 0 0
  • 本文總結(jié)了數(shù)組所有的方法。 1. 檢測(cè)對(duì)象是不是數(shù)組 instanceof操作符 Array.isArray()方...
    胡不歸vac閱讀 683評(píng)論 0 1
  • 昨天和男票鬧了點(diǎn)不愉快,緣起是他又在電話里向我抱怨生活的不順榕暇,實(shí)際上他持續(xù)這種狀態(tài)蓬衡,已經(jīng)將近兩三個(gè)月之久了,這一段...
    我有酒閱讀 256評(píng)論 0 0