这篇文章主要介绍了web前端实例分析的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇web前端实例分析文章都会有所收获，下面我们一起来看看吧。
正文
这题的规则是这样的
给定有一个 Add 函数，要支持以下形式的调用Add(1)(2)(3).sumOf(); // 输出 6Add(1,2)(3)(4).sumOf(); // 输出 10Add(1,2,...)(3)(4)(...).sumOf(); // ...拿到这种题目，我先来说说我自己的做题流程，一般会去找它最简单的形态。我们一步一步来拆解。
先去掉 sumOf() 变成了以下形态
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; } AddPro.sumOf = () => { return nums.reduce((a, b) => a + b); } return AddPro;}好啦好啦，结束啦。
等等
在最后，我再来补充一种方案，function 不仅可以继续挂载 function ~ 还可以挂载变量哦~
function Add() { if (!Add.nums) { Add.nums = []; } Add.nums.push(...arguments); return Add;}Add.sumOf = () => { return Add.nums.reduce((a, b) => a + b);}我们总结一下，小小的面试题涉及到的基础知识。
闭包、递归、作用域、函数与对象
基础就是基础，永远是你爸爸，掌握好基础，以不变应万变。
关于“web前端实例分析”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“web前端实例分析”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注编程网行业资讯频道。
