高阶函数
函数的参数可以接收另一个函数，这类函数称之为高阶函数
map
JavaScript的map()是Array中的一个方法，调用Array的map()方法会返回一个新的Array
function foo(item) {
return item * item;
}
[1, 3, 5, 7, 9].map(foo); // [1, 9, 25, 49, 81]
笃、笃、笃（敲黑板）
首先举个栗子🌰
var arr = ['1', '2', '3'];
arr.map(parseInt);
// ？
// ？
首先要理解map()：
一般map 方法中的 callback 函数只需要接受一个参数，也就是正在被遍历的数组元素本身。
但这并不意味着 map 只给 callback 传了一个参数，而是三个。
// array.map(function(currentValue, index, arr), thisArg)
// 参数：
// currentValue 必须。当前元素的值
// index 可选。当期元素的索引值
// arr 可选。包含当期元素的数组对象。
// thisArg 可选。 可在 callback 函数中为其引用 this 关键字的对象。 如果省略 thisArg，则 undefined 将用作 this 值。
顺带了解一下parseInt：
通常使用parseInt时，只需要传递一个参数，但实际上，parseInt可以有两个参数，第二个参数是进制数，默认是十进制。
此时你可能已经想到了，map方法在调用callback时，给parseInt传了三个参数， 第三个参数parseInt会忽视, 但第二个参数不会，也就是说，parseInt把传过来的索引值当成进制数来使用，从而返回了NaN。
var arr2 = ['10', '10', '10', '10', '10', '10'];
arr2.map(parseInt); // [10, NaN, 2, 3, 4, 5]
这个问题可以自己写一个简单的方法来处理：
var arr = ['1', '2', '3'];
function returnInt(element){
return parseInt(element,10);
}
arr.map(returnInt); // 返回[1,2,3]
reduce
Array的reduce() 方法接收一个函数callbackfn 作为累加器，这个回调函数必须接收两个参数，对数组中的值从左到右两两合并，最终返回一个值。
语法：
array.reduce(function(preValue,curValue,index,array) {},[initialValue])
callbackfn函数，而这个函数包含四个参数:
// preValue: 上一次调用回调返回的结果，或者是提供的初始值（initialValue）
// curValue: 当前值
// index: 当前值的索引
// array: 调用 reduce()方法的数组
initialValue是非必填参数，可作为第一次调用callbackfn函数的第一个参数。
回调函数第一次执行时，preValue 和 curValue 可以是一个值，如果 initialValue 在调用 reduce() 时被提供，那么第一个 preValue 等于 initialValue，并且 curValue 等于数组中的第一个值；
var arr = [0,1,2,3,4];
arr.reduce(function (preValue,curValue,index,array) {
return preValue + curValue;
}); // 10
如果 initialValue 未被提供，那么 preValue 等于数组中的第一个值，curValue 等于数组中的第二个值。
var arr = [0,1,2,3,4];
arr.reduce(function (preValue,curValue,index,array) {
return preValue + curValue;
}, 5); // 15
从例子中可以看出，对数组的求和我们可以使用 reduce() 方法，当然也可以有更多的用途，比如求最值：
var arr = [7,1,5,3,4];
arr.reduce(function (preValue,curValue,index,array) {
if (preValue > curValue) {
return preValue
} else {
return curValue
}
}, 6); // 7
与 reduce() 方法对应的还有 reduceRight() 方法，与 reduce() 方法不同的是 reduceRight() 方法是从后往前做累积。根据不同需求，灵活选择不同的方法。
对于一个数组各项的值求和的问题，我们也可以使用 for 或 while 循环来实现，那么究竟哪一种方法是更高效的呢，我们来做一个实验：
for：
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.time("forFn");
Array.prototype.forFn = function () {
for (var i = 0; i < 100000; i++) {
var sum = 0;
for (var j = 0; j < this.length; j++) {
sum += parseInt(this[j]);
}
}
return sum;
}
arr.forFn()
console.log('输出结果：' + arr.forFn()); // 45
console.timeEnd("forFn"); // forFn: 5.98779296875ms
while：
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.time("whileFn");
Array.prototype.whileFn = function () {
for (var i = 0; i < 100000; i++) {
var sum = 0;
var j = this.length;
while (j--) {
sum += parseInt(this[j]);
}
}
return sum;
}
arr.whileFn()
console.log('输出结果：' + arr.whileFn()); // 45
console.timeEnd("whileFn"); // whileFn: 5.89013671875ms
reduce()：
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.time("ruduce");
Array.prototype.sum = function () {
for (var i = 0; i < 100000; i++) {
return this.reduce (function (preValue, curValue) {
return preValue + curValue; });
}
}
console.log('输出结果：' + arr.sum()); // 45
console.timeEnd("ruduce"); // ruduce: 0.27490234375ms
以上测试是在 Mac 端 Chrome 浏览器进行的测试，使用for循环将测试结果放大了十万倍，通过耗时比较不难发现 reduce() 方法更高效，是 for 和 while 的 20多倍，（不同环境，不同浏览器之间会存在一定的差距）。
如需转载，烦请注明出处：http://www.jianshu.com/p/b51700bcd0f4
