JavaScript 函数柯里化

93 阅读2分钟

为什么提到这个这个柯里化呢?在前端工具库 lodash 有这么一个函数是关于柯里化的方法。 看到这个函数,使我对柯里化这个“高端”的技术词产生了浓厚的兴趣,所以,这篇文章通过两段代码让你彻底了解柯里化。

柯里化的定义。

什么是柯里化?柯里化简单来说就是如果有一个函数需要接受多个参数,你想让这个函数每次只接受一个函数,并且返回余下参数和结果。多变一,就是柯里化。

柯里化JS函数。

首先,我们先出一道题目。

function add() { // 现在有一个add函数
}

add(1)(2)(3) // 调用这个方法得到所有参数的和

看到这道题目的时候我们首先想到的使用闭包,一是闭包可以使函数接受两次同时调用,二是闭包内的内存不被清除,可以保存变量,方便计算。我们按照这两种思路来写一下。

function add(a) { // 一个名为 add 的函数
	return function (b) { // 返回一个函数方便调用以后再次调用
		return a + b // 返回计算以后的值
	}
}
add(1)(2)(3) // 求三次调用函数得到的和

大家一看就知道,这不对啊,函数有三次调用,代码里只写了两次。

执行结果:

image.png

让我们用简单的方法去写一下

// 函数柯里化
function curry(addFn, ...args) {
	// 方便下一次调用
	return (...params) => {
		// 合并之前的参数 + 新参数
		let _args = [...args, ...params]
		// 判断传参数量是否跟设定好的参数数量是否大于等于、相等
		if(_args.length >= addFn.length) {
			// 把合并过后的数组传递到加加函数
			return  addFn(..._args)
		}else {
			// 返回一个新函数,方便剩下的函数调用
			return curry(addFn,  ..._args)
		}
	}
}
// 最终实现结果 解决实际需求
function add(a, b, c, d, e) {
	console.log(a + b + c + d + e);
}

// 主函数
function foo(...args) {
	return curry(add, ...args)
}


foo(1,2)(3)(4)(5)

foo(1)(2)(3)(4)(5)

foo(1,2,3)(4,5)

得到结果:

image.png

简单吧?嗯!