面试题:实现add(1)(2)(3) //结果 = 6,题的核心就是问的js的柯里化面试
先说说什么是柯里化,看过许多关于柯里化的文章,始终搞不太清楚,例如:柯里化(Currying)是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,而且返回接受余下的参数且返回结果的新函数的技术。大多数的blog都是这种说法,说实话我是懵逼的。
个人理解是,curry是一个收集参数的方法,收集够了去执行函数。segmentfault
实现前咱们先列一下要点
一、收集参数(就像面试题屡次执行多个参数)是的利用闭包
二、每次执行参数有多有少例如add(1)(2,3)(4)
三、咱们须要知道何时参数够了数组
//如题 //add(1)(2)(3) //逻辑应该是这样add(1)执行收集参数1继续执行收集参数2依次类推直到收集完毕。 function curry(fn) { let arg = []; //用于收集参数 //作一个闭包https://segmentfault.com/a/1190000017824877 return function() { //每执行一次收集一次参数,为何用concat是由于有时候后是多个参数(2,3) arg = arg.concat([...arguments]); //直到参数收集完成执行fn // 咱们须要知道何时收集完了,条件就是curry参数fn的参数个数 fn.length //若是收集的参数个数大于等于fn的参数个数执行fn,若是没有递归执行 if (arg.length >= fn.length) { return fn(...arg) } // 参数没有收集完咱们须要继续收集,递归 return arguments.callee } } // 测试一下 let testAdd = curry(add1) // console.log(testAdd(1)(2)(3)) // console.log(testAdd(1, 2)(3)) //console.log(testAdd(1)(2, 3))
一不当心写完了!闭包
不过不能标题党,说好的详解,接下来咱们解析一下网上大多数柯里化的实现代码app
function curry(fn) { function _c(restNum, argsList) { return restNum === 0 ? fn.apply(null, argsList) : function(x) { return _c(restNum - 1, argsList.concat(x)); }; } return _c(fn.length, []); }
一眼看不明白没事,咱们多看几眼。
解析:
一、curry也是接收一个参数(fn)这个是必然
二、返回了一个函数,接收两个参数,fn.length和一个空数组这个好解
释,我写的简版也说过了,fn.length是为了判断参数是否收集够
了,参数传一个空数组其实也是闭包的一种实现,用来收集参数。
三、里边是一个三目判断,看着花里胡哨的没那么复杂,判断fn的参数个数若是是0,那就不必收集了直接执行fn,至于fn.apply(null,argList)我很明白的大声说出来会用个apply就处处用吗?在我看来没有一分钱用,之因此用是由于argList是一个数组,正好apply正好支持第二个参数是数组,主要看起来很牛逼的样子。
四、收集参数,fn参数个数不为零,每次收集fn函数参数的个数减一,直到等于0执行fn,这个就没有我写的通用了,我一次传俩就挂了。函数
再来一个例子:bind方法实现测试
Function.prototype.bind = function(context) { //返回一个绑定this的函数,咱们须要在此保存this let self = this // 能够支持柯里化传参,保存参数 let arg = [...arguments].slice(1) // 返回一个函数 return function() { //一样由于支持柯里化形式传参咱们须要再次获取存储参数 let newArg = [...arguments] console.log(newArg) // 返回函数绑定this,传入两次保存的参数 //考虑返回函数有返回值作了return return self.apply(context, arg.concat(newArg)) } } // 搞定测试 let fn = Person.say.bind(Person1) fn() fn(18)
是的bind方法就是用的柯里化,bind实现详情请移步:https://segmentfault.com/a/11...this