柯里化函数

引言

现在我们需要写一个用来拼接网址的函数，要求3个参数：protocol，hostname，pathname。

通常写法是这样的：

function url(protocol, hostname, pathname) {
  return `${protocol}${hostname}${pathname}`;
}
var baidu = url('https://', 'www.baidu.com', '/index.html');
var blibili = url('https://', 'www.bilibili.com', '/read/home');

console.log(baidu);
console.log(blibili);

但我们在拼接网址时发现，protocol参数每次都需要我们输入，但百度与b站的网络传输协议都是支持https的，每次都写一样的参数，这样无疑增加了我们的工作量。这时候我们为了节省代码量，提高代码复用性，可以这样写：

function url(protocol) {
  return function (hostname, pathname) {
    return `${protocol}${hostname}${pathname}`;
  };
}
var https = url('https://');

var baidu = https('www.baidu.com', '/index.html');
var blibili = https('www.bilibili.com', '/read/home');
console.log(baidu);
console.log(blibili);

var https = url('https://');
将'https://'传入函数url，然后返回一个新函数，变量https接收这个函数。由于形成了闭包，这个返回出来的新函数可以访问到函数url中protocol这个参数。

这样就达到了书写一次相同参数，后面可以无限复用的效果。

---

柯里化函数思想

在计算机科学中，柯里化（Currying）是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术。

看完是不是很懵? 那我举个例子你就懂了。
比方说：现在我有个add函数:

function add(a,b,c,d){
	return a+b+c+d;
}

本来是这样子使用的：

add(2,3,2,1);//输出8

假如我们实现了一个将函数柯里化的函数，叫做Curry。有了这个函数我们就可以这样去使用了：

var _add = Curry(add);
_add(2)(3)(2)(1);//输出8

还可以这样：

var _add = Curry(add,2,1);
_add(3)(2);//输出8
_add(1)(2);//输出6

---

柯里化函数实现

那么我们怎么去实现柯里化函数呢？
实现柯里化，我们首先得想明白，之所以每次函数调用完之后能够继续调用，那么它必须是一个函数。也就是说，在没有传完参数以前，它的返回值是一个函数。并且之前传递进去的参数都暂时保留着，直到参数传完了，就会去传给add并调用。

function Curry(fn, arr) {
//fn代表回调函数，也就是我们需要柯里化的函数。
//arr用来保存之前传递的参数

  let length = fn.length;
  if (Array.isArray(arr)) {
    //如果是数组
    arr = arr;
  } else {
    //如果arr为undefined或者为给add传递的参数
    arr = [].slice.call(arguments, 1); //获取参数;
  }

  return function inner() {
    //拼接参数存入新数组  
    //一定要存入新数组，否则会污染外部arr，造成无法复用
    let newarr = arr.concat([].slice.call(arguments, 0));
    //如果参数传递完了
    if (newarr.length === length) {
      return fn.apply(null, newarr);
    } else if (arr.length < length) {
      //当参数未传递完时
      return Curry.call(this, fn, newarr);  
    }
  };
}

我们来测试一下

function add(a, b, c, d) {
  return a + b + c + d;
}
var newCurry = Curry(add,1,2);
console.log(newCurry(3)(4));
console.log(newCurry(6)(6));
console.log(newCurry(6,6));

在实际开发中会遇到许多不同要求的柯里化函数。我在这里只是例举了一个简单的例子供大家了解什么是柯里化。最重要的还是掌握柯里化思想！有了这个思想，尽管形式上变化多端，但其特质不变，我们也就无惧了。