Add(1,2,…)(3)(4)(…)
嗯…有点熟悉…但是还是有点复杂,那我们再去掉无限调用这个限制。
Add(1,2,…)(3)(4)
唔,还是有点难呀…没关系,再砍, 不要传入多个参数。
Add(1)(2)(3)
有…有…有那味了…这…这不就是柯里化吗…
有些小朋友可能没有听过,对于大朋友而言耳熟能详,融会贯通。
我们还是来介绍一下。
在《javascript高级程序设计》这本书中有如下介绍:
与函数绑定紧密相关的主题是函数柯里化,它用于创建已经设置好的一个或者多个参数的函数。函数柯里化的基本方法和函数绑定是一样的:使用一个闭包返回一个函数。两者的区别在于,当函数被调用时,返回的函数还需要设置一些传入的参数。
我们来写写看:
function Add(x) {
return function (y) {
return return functio (z) {
return x + y + z;
}
}
}
// 简洁写法
const Add = x => y => z => x+y+z;
执行一下
Add(1)(2)(3) // 6
是我们要的那味~
那么我们既然已经写出了这个形态,我们就一步一步反推。
这个时候千万别紧张,我们从最低级的形态出发,写出一个最基本的形态,能够有效地帮助我们建立自信心,吃下定心丸,按照这种方式,哪怕我们最终没有写出完美的结果,让面试官看到你思考解题的过程,也是一种加分。
好,接着说~
那我们接下来需要实现这个样子。
Add(1,2,…)(3)(4)
传入参数不止一个
我们知道,对于不确定参数个数,我们可以使用 arguments
这个对象来获取到所有的入参,但是 arguments
不是一个 Array
,但是我们可以使用 ES6 中的 Spread syntax (展开语法)去将他变成一个数组。表演继续。
function Add() {
const nums = […arguments];
return function() {
nums.push(…arguments);
return function() {
nums.push(…arguments);
return nums.reduce((a, b) => a + b);
}
}
}
nice!已经离我们最终的形态越来越近了。接下来是这个函数能够无限的进行调用。
Add(1,2,…)(3)(4)(…)
那么怎么样才能无限调用呢?没错,用递归。
function Add() {
const nums = […arguments];
function AddPro() {
nums.push(…arguments);
return AddPro;
}
return AddPro;
}
嗯,其实我们写到这里发现了… 由于是无限递归,我们没办法确定最后一次函数调用,因此我们需要最后显式调用一个结束的方法来打印出最后的数据。
很自然地,我们可以在 AddPro
添加一个方法 sumOf
来解决这个问题。
学弟就是卡在这里地方,被函数添加上一个方法搞懵了。你是否知道呢?
function Add() {
const nums = […arguments];
function AddPro() {
nums.push(…arguments);
return AddPro;
}
其实前端开发的知识点就那么多,面试问来问去还是那么点东西。所以面试没有其他的诀窍,只看你对这些知识点准备的充分程度。so,出去面试时先看看自己复习到了哪个阶段就好。
这里再分享一个复习的路线:(以下体系的复习资料是我从各路大佬收集整理好的)
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
《前端开发四大模块核心知识笔记》
最后,说个题外话,我在一线互联网企业工作十余年里,指导过不少同行后辈。帮助很多人得到了学习和成长。
我意识到有很多经验和知识值得分享给大家,也可以通过我们的能力和经验解答大家在IT学习中的很多困惑,所以在工作繁忙的情况下还是坚持各种整理和分享。