深入学习JavaScript 高阶函数(2)

const arr = [0, 1, 2, 3, 4]; let sum = arr.reduce((accumulator, currentValue, currentIndex, array) => { return accumulator + currentValue; }, 10); console.log( sum ); // 20 console.log( arr ); // [0, 1, 2, 3, 4]

代码的执行过程如下所示，callback 总共调用五次。

callback accumulator currentValue currentIndex array return value
first call   10   0   0   [0, 1, 2, 3, 4]   10  
second call   10   1   1   [0, 1, 2, 3, 4]   11  
third call   11   2   2   [0, 1, 2, 3, 4]   13  
fourth call   13   3   3   [0, 1, 2, 3, 4]   16  
fifth call   16   4   4   [0, 1, 2, 3, 4]   20  

函数作为返回值输出

这个很好理解，就是返回一个函数，下面直接看两个例子来加深理解。

isType 函数

我们知道在判断类型的时候可以通过 Object.prototype.toString.call 来获取对应对象返回的字符串，比如：

let isString = obj => Object.prototype.toString.call( obj ) === '[object String]'; let isArray = obj => Object.prototype.toString.call( obj ) === '[object Array]'; let isNumber = obj => Object.prototype.toString.call( obj ) === '[object Number]';

可以发现上面三行代码有很多重复代码，只需要把具体的类型抽离出来就可以封装成一个判断类型的方法了，代码如下。

let isType = type => obj => { return Object.prototype.toString.call( obj ) === '[object ' + type + ']'; } isType('String')('123'); // true isType('Array')([1, 2, 3]); // true isType('Number')(123); // true

这里就是一个高阶函数，因为 isType 函数将 obj => { ... } 这一函数作为返回值输出。

add 函数

我们看一个常见的面试题，用 JS 实现一个无限累加的函数 add，示例如下：

add(1); // 1 add(1)(2); // 3 add(1)(2)(3)； // 6 add(1)(2)(3)(4)； // 10 // 以此类推

我们可以看到结构和上面代码有些类似，都是将函数作为返回值输出，然后接收新的参数并进行计算。

我们知道打印函数时会自动调用 toString()方法，函数 add(a) 返回一个闭包 sum(b)，函数 sum() 中累加计算 a = a + b，只需要重写sum.toString()方法返回变量 a 就可以了。

function add(a) { function sum(b) { // 使用闭包 a = a + b; // 累加 return sum; } sum.toString = function() { // 重写toString()方法 return a; } return sum; // 返回一个函数 } add(1); // 1 add(1)(2); // 3 add(1)(2)(3)； // 6 add(1)(2)(3)(4)； // 10

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章: