JS高阶函数之柯里化
在最近项目中遇到了一个问题,字符串(0)(1)-(2)-(3)(4)代表具有(0)(1)(4)权限,-(2)-(3)代表被排除,这时候很快就联想到柯里化这个词的,之前还是在看一篇算法题提到函数柯里化(Currying),满满的音译既视感,实际了解之后才发现其实就是高阶函数的一个特殊用法。
柯里化是指这样一个函数(假设叫做createCurry),它能够接收函数A作为参数,运行后能够返回一个新的函数。并且这个新的函数能够处理函数A的剩余参数。
我们可以先看下函数式编程穷人版思路,举个栗子:
var str =" JavaScript ";
const trim = str => str.trim();
const warpInSpan = str => `<span>${
str}</span>`;
const tolower = str => str.toLowerCase();
console.log(tolower(warpInSpan(trim(str)));
//输出<span>javascript</span>
我们可以看到,这种实现思路非常简单,但是对于一个追求可读性程序猿来说,这种一层一层嵌套肯定是不能满足的。这时候我们可以使用函数式编程之管道(从左至右分别处理数据流的过程称为管道或序列)进行改造:
var str =" JavaScript ";
const trim = str => str.trim();
const warpInSpan = str => `<span>${
str}</span>`;
const tolower = str => str.toLowerCase();
const pipe = function(...funs){
return function(str){
return funs.reduce((str,fn) =>fn(str), str);
}
}
var result = pipe(trim,warpInSpan,tolower);
console.log(result(str));
//输出<span>javascript</span>
这里我们成功的把一个函数的输出值做为下一个函数的输入值,这样看起来舒服多了,但是如果有多个参数,这里就不适用了,柯里化思想场景之一就是把多参数转换成一元函数。
var str =" JavaScript ";
const trim = str => str.trim();
const warp = tag => str => `<span>${
str}</span>`;
/*
相当于
const warp = function(tag){
return function(str){
return `<span>${str}</span>`
}
}
*/
const tolower = str => str.toLowerCase();
const pipe = function(...funs){
return function(str){
return funs.reduce((str,fn) =>fn(str), str);
}
}
//这里便可以传参了
var result = pipe(trim,warp("span"),tolower);
console.log(result(str));
//输出<span>javascript</span>
再次捋一下思路,柯里化指的是将一个接受多个参数的函数转为一次只接受一个参数的函数,将已接受的参数保存起来,返回接受剩余参数的新函数,当传入参数个数之和等于被柯里化的原函数的参数个数,返回计算结果。这样可以使得函数变成只接受一个参数,返回一个值的状态,降低了编程复杂性。
记得一些面试题中,有一种比较经典的题,实现
add(1)(2)(3)(4) = 10;
add(1)(1,2,3)(2) = 9;
或者mul(2)(3)(4)=24;这种类型
对于这种类型,就可以使用隐式转换结合柯里化思想代码实现:
function add(){
var args = Array.prototype.slice.call(arguments);
var _add = function(){
args.push(...arguments);
return _add;
}
_add.toString = function(){
return args.reduce(function(a,b){
return a+b;
},0)
}
return _add;
}
let a = add(1,2,3,4)
let b = add(1,4)(2)(3)
console.log(a)
console.log(b)
来源:oschina
链接:https://my.oschina.net/u/4305437/blog/4759612