Javascript 基础之高阶函数

2017-03-20 本文已影响62人编程go

高阶函数

higher-order function (also functional, functional form or functor) is a function that does at least one of the following:
takes one or more functions as arguments (i.e., procedural parameters),
returns a function as its result.[disputed – discuss]

比如我们要实现一个算术运算 z = x * y

普通函数实现，######

function multiply (x, y) {
    return x * y;
}
var result = multiply(4, 5);
console.log(result);

高阶函数实现，######

function multiply (x, y) {
    return x * y;
}
function highMultiply(x, y, fun) {
    return fun (x, y)
}
var result = highMultiply(4, 5, multiply);
console.log(result);

高阶函数之 map/reduce

map/reduce 就是Google 鼎鼎大名的[MapReduce: Simplified Data Processing on Large Clusters](https://dirtysalt.github.io/mapreduce.html#orgheadline1）

map 函数#####

举个栗子，函数f(x) = x * x

map

//代码实现如下
function square(params) {
    return params * params;
}
var arr = ['1', '3', '5', '7'];
var result = arr.map(square);
console.log(result);

// 使用map 函数将数字转换为字符
var numberArr = [1, 3, 5, 7];
var result = numberArr.map(String);
console.log(result); //['1', '3', '5', '7']

// 使用map 函数将字符转换为数字
var strArr = ['1', '3', '5', '7'];
var result = strArr.map(parseInt);
console.log(result);  // [1, NaN, NaN, NaN]

上面的栗子，的输出结果与预期并不相符，是什么原因呢？
首先查看map的函数，他的callbckfn会有三个parameters，我们只是默认的使用第一个parameter。

map<U>(callbackfn: (value: T, index: number, array: T[]) => U, thisArg?: any): U[];

再看看parseInt 函数, 他是需要两个参数的，这样就会出错了。

declare function parseInt(s: string, radix?: number): number;

修改后，

// 使用map 函数将字符转换为数字
var strArr = ['1', '3', '5', '7'];
var result = strArr.map(Number);
console.log(result);  // [1, 3, 5, 7]

reduce 函数#####

这个函数必须接收两个参数，reduce()把结果继续和序列的下一个元素做累积计算，其效果就是：[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

// 如何吧一组不规则的字符数组，转换为首字母大写其余都是小写的数组
var arr = ["wo", "SHI", "shUI"];
function fun(x, y) {
    if (x.length == 1)
        return x.toUpperCase() + y.toLocaleLowerCase();
    return x + y.toLocaleLowerCase();
}
var result = [];
arr.forEach(function(element) {
    var currentArr = element.split('');
    var value = currentArr.reduce(fun);
    result.push(value);
}, this);

console.log(result);  // ["Wo", "Shi", "Shui"]

filter 将数组中的某些元素过滤掉，函数过滤后的数组

var arr = ['A1', 'B2', 'C2', 'D2', 'B2'];
var result = arr.filter(function (element, index, self) {
    return self.indexOf(element) === index;
});
 console.log(result)   // ['A1', 'B2', 'C2', 'D2']

sort()方法就是用于排序

Noted：

sort 函数默认是将所有的待比较数据转换为string 类型
sort 函数对string 类型的比较是按照ASCII 码的顺序进行比较的，因此相同字符大写要比小写靠前。

var arr = [10, 2, 5, 23, 7];
var result = arr.sort();
console.log(result);  // [10, 2, 23 ,5 , 7]