如果你讀過Google的那篇大名鼎鼎的論文:MapReduce: Simplified Data Processing on Large Clusters, 你就能大概明白map/reduce的概念食磕。
map
舉例說明和泌,比如我們有一個函數(shù)f(x) = x2,要把這個函數(shù)作用在一個數(shù)組[1, 2, 3, 4, 5, 6, 7, 8, 9]上赂弓,就可以用map實現(xiàn)如下:
由于map()方法定義在JavaScript的Array中库快,我們調(diào)用Array的map()方法产阱,傳入我們自己的函數(shù)渠退,就得到了一個新的Array作為結(jié)果:
function pow(x) {
return x * x;
}
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
app.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
map()傳入的參數(shù)是pow江解,即函數(shù)對象本身设预。
你可能會想,不需要map()犁河,寫一個循環(huán)絮缅,也可以計算出結(jié)果:
var f = funciton (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的每一個元素并把結(jié)果生成一個新的Array”耕魄。
所以画恰,map()作為高階函數(shù),事實上它把運算規(guī)則抽象了吸奴,因此允扇,我們不但可以計算簡單的f(x)=x2,還可以計算任意復(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() 把一個函數(shù)作用在這個Array的[x1, x2, x3...]上糊治,這個函數(shù)必須接收兩個參數(shù),reduce()把結(jié)果繼續(xù)和序列的下一個元素做累積計算罚舱,其結(jié)果就是:
[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
比方說對一個Array求和井辜,就可以用reduce實現(xiàn):
var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {
return x + y;
}); // 25
ex1,利用reduce()求積:
'use strict';
function product(arr) {
return arr.reduce(function (x, y) {
return x * y;
});
}
// 測試:
if (product([1, 2, 3, 4]) === 24 && product([0, 1, 2]) === 0 && product([99, 88, 77, 66]) === 44274384) {
alert('測試通過!');
}
else {
alert('測試失敗!');
}
ex2:把[1, 3, 5, 7, 9]變換成整數(shù)13579,reduce()也能派上用場:
var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {
return x * 10 + y;
}); // 13579
如果我們繼續(xù)改進這個例子管闷,想辦法把一個字符串13579先變成Array------[1, 3, 5, 7, 9], 再利用reduce() 就可以寫出一個把字符串轉(zhuǎn)換為Number的函數(shù)粥脚。
ex3: 不要使用JavaScript內(nèi)置的parseInt()函數(shù),利用map和reduce操作實現(xiàn)一個string2int()函數(shù):
'use strict';
function string2int(s) {
var arr = [];
for (var i=0; i<s.length; i++) {
arr.push(s[i]);
}
return arr.map(function(x) {
return x * 1;
}).reduce(function(x, y) {
return x * 10 + y;
});
}
// 測試:
if (string2int('0') === 0 && string2int('12345') === 12345 && string2int('12300') === 12300) {
if (string2int.toString().indexOf('parseInt') !== -1) {
alert('請勿使用parseInt()!');
} else if (string2int.toString().indexOf('Number') !== -1) {
alert('請勿使用Number()!');
} else {
alert('測試通過!');
}
}
else {
alert('測試失敗!');
}
ex4:請用戶輸入的不規(guī)范的英文名字包个,變?yōu)槭鬃帜复髮懰⒃剩渌懙囊?guī)范名字。輸入:['adam', 'LISA', 'barT'], 輸出:['Adam', 'lisa', 'Bart']碧囊。
'use strict';
function normalize(arr) {
return arr.map(function(s) {
return s.toLowerCase();
}).map(function(s) {
return s[0].toUpperCase() + s.slice(1)
});
}
// 測試:
if (normalize(['adam', 'LISA', 'barT']).toString() === ['Adam', 'Lisa', 'Bart'].toString()) {
alert('測試通過!');
}
else {
alert('測試失敗!');
}
ex5: 小明希望利用map()把字符串變成整數(shù)树灶,他寫的代碼很簡潔:
'use strict' ;
var arr = ['1', '2', '3'];
var r;
r = arr.map(function(s){
return parseInt(s);
});
alert('[' + r[0] + ', ' + r[1] + ', ' + r[2] + ']');