JavaScript之map reduce_動力節(jié)點(diǎn)Java學(xué)院整理
如果你讀過Google的那篇大名鼎鼎的論文“MapReduce: Simplified Data Processing on Large Clusters”，你就能大概明白map/reduce的概念。
map
舉例說明，比如我們有一個(gè)函數(shù)f(x)=x2，要把這個(gè)函數(shù)作用在一個(gè)數(shù)組[1, 2, 3, 4, 5, 6, 7, 8, 9]上，就可以用map實(shí)現(xiàn)如下：
由于map()方法定義在JavaScript的Array中，我們調(diào)用Array的map()方法，傳入我們自己的函數(shù)，就得到了一個(gè)新的Array作為結(jié)果：
function pow(x) {
return x * x;
}
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
map()傳入的參數(shù)是pow，即函數(shù)對象本身。
你可能會想，不需要map()，寫一個(gè)循環(huán)，也可以計(jì)算出結(jié)果：
var f = function (x) {
return x * x;
};
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var result = [];
for (var i=0; i<arr.length; i++) {
result.push(f(arr[i]));
}
的確可以，但是，從上面的循環(huán)代碼，我們無法一眼看明白“把f(x)作用在Array的每一個(gè)元素并把結(jié)果生成一個(gè)新的Array”。
所以，map()作為高階函數(shù)，事實(shí)上它把運(yùn)算規(guī)則抽象了，因此，我們不但可以計(jì)算簡單的f(x)=x2，還可以計(jì)算任意復(fù)雜的函數(shù)，比如，把Array的所有數(shù)字轉(zhuǎn)為字符串：
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; arr.map(String); // ['1', '2', '3', '4', '5', '6', '7', '8', '9']
只需要一行代碼。
reduce
再看reduce的用法。Array的reduce()把一個(gè)函數(shù)作用在這個(gè)Array的[x1, x2, x3...]上，這個(gè)函數(shù)必須接收兩個(gè)參數(shù)，reduce()把結(jié)果繼續(xù)和序列的下一個(gè)元素做累積計(jì)算，其效果就是：
[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
比方說對一個(gè)Array求和，就可以用reduce實(shí)現(xiàn)：
var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {
return x + y;
}); // 25
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
JS 事件綁定函數(shù)代碼，解決了瀏覽器兼容，現(xiàn)在可以兼容IE6 7 8 FF 谷歌2010-04-04
這篇文章主要介紹了對js閉包理解，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
JS實(shí)現(xiàn)購物車中商品總價(jià)計(jì)算
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)購物車中商品總價(jià)的計(jì)算 ，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-03-03
這篇文章主要介紹了JS輸入用戶名自動顯示郵箱后綴列表的方法,可實(shí)現(xiàn)自動顯示郵箱后綴名列表的功能,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-01-01
這篇文章主要給大家介紹了關(guān)于js獲取光標(biāo)位置的最新方法,獲取光標(biāo)位置,最常用的方法就是使用Selection對象和Range對象,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-09-09
基于Bootstrap下拉框插件bootstrap-select使用方法詳解
這篇文章主要為大家詳細(xì)介紹了基于Bootstrap下拉框插件bootstrap-select的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-08-08
Javascript實(shí)現(xiàn)貪吃蛇小游戲（含詳細(xì)注釋）
這篇文章主要為大家詳細(xì)介紹了Javascript實(shí)現(xiàn)貪吃蛇小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-10-10
微信小程序?qū)崿F(xiàn)短信登錄的實(shí)戰(zhàn)
項(xiàng)目要求增加短信登錄及人臉識別登錄功能，本文就來實(shí)現(xiàn)一下 短信登錄功能，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-10-10
JS實(shí)現(xiàn)勻速與減速緩慢運(yùn)動的動畫效果封裝示例
這篇文章主要介紹了JS實(shí)現(xiàn)勻速與減速緩慢運(yùn)動的動畫效果,結(jié)合實(shí)例形式分析了JavaScript封裝結(jié)合定時(shí)器的頁面元素動態(tài)變換效果動畫相關(guān)操作技巧,需要的朋友可以參考下2018-08-08
這篇文章主要通過一張圖讓你看懂JavaScript各類型的關(guān)系，需要的朋友可以參考下2015-10-10