JavaScript柯里化详解：概念、作用与通用实现

函数式编程与柯里化概述

函数式编程是一种目前广泛采用的编程范式，其核心理念是将函数作为参数传递，并返回一个不产生副作用的函数。简而言之，这种范式强调让每个函数只专注于完成单一任务。

包括JavaScript、Haskell和Clojure在内的多种编程语言均支持函数式编程特性。

这种编程思想主要包含三个关键概念：

纯函数
柯里化
高阶函数

本文旨在通过具体案例，清晰阐释柯里化这一核心概念。

柯里化的基本概念与流程

什么是柯里化

首先，我们通过一个具体示例来引入这一概念：


function sum(a, b, c) {
 return a + b + c;
}
// 调用
sum(1, 2, 3); // 6

上述代码实现的是将a、b、c三个参数相加的功能。若将其改写为柯里化形式，代码如下：


function sum(a) {
 return function (b) {
  return function(c) {
    return a + b + c;
    } 
  }
}
// 调用
let sum1 = sum(1);
let sum2 = sum1(2);
sum2(3); // 6

所谓柯里化，本质上是将一个拥有多个参数的函数，转换为一系列只接受较少参数（通常是一个参数）的函数的过程。

让我们逐步分析上述柯里化函数的执行流程。第一步调用sum(1)时，变量sum1实际上被赋值为：


sum1 = function(b) {
  return function(c) {
  // 注意此时变量a存在于闭包中，可以调用，a = 1
  return a + b + c;
 }
}

接着调用sum1(2)，此时变量sum2被赋值为：


sum2 = function(c) {
 // 变量a,b皆在闭包中, a = 1, b = 2
 return a + b + c;
}

最后调用sum2(3)，函数返回1 + 2 + 3的计算结果，即6。

这就是一个最基础的柯里化函数示例，其逻辑是否清晰易懂？

柯里化的实际应用价值

柯里化函数的作用

读者可能会疑惑，改写后的柯里化函数相比原函数代码量显著增加，且可读性降低，那么柯里化究竟有何实际用途？

诚然，在此特定场景下，柯里化函数显得冗余且不实用。但在许多实际开发场景中，它发挥着重要作用，甚至开发者在不知不觉中已在使用它。以下是一个简单的应用示例：

假设我们需要计算一批长方体的体积，常规实现函数如下：


function volume(length, width, height) {
  return length * width * height;
}
volume(200, 100, 200);
volume(200, 150, 100);
volume(200, 50, 80);
volume(100, 50, 60);

观察上述计算长方体体积的函数，会发现许多长方体具有相同的长度。若使用柯里化函数重新实现，代码如下：


function volume(length, width, height) {
  return function(width) {
    return function(height) {
     return length * width * height;
      }
  }
}
let len200 = volume(200);
len200(100)(200);
len200(150)(100);
len200(50)(80);
volume(100)(50)(60);

如上所示，通过定义一个len200函数，我们可以统一处理长度为200的长方体体积计算，这实现了参数的复用。

再举一个仅允许函数执行一次的示例：


function execOnce(fun) {
  let flag = true;
 return function() {
  if (flag) {
   fun && fun();
   flag = false;
  }
 }
}
let onceConsole = execOnce(function() {
  console.log('只打印一次');
});
onceConsole();
onceConsole();

如上代码，我们实现了一个execOnce函数，它接收一个函数作为参数，并返回一个新函数。变量flag存在于闭包中，用于判断返回的函数是否已被执行过。此时，变量onceConsole相当于：


let onceConsole = function() {
 if (flag) {
    (function() {
    console.log('只打印一次');
   })()
   flag = false;
  }
}

这也是柯里化函数的一个典型应用场景。

通用柯里化函数的实现方案

通用柯里化函数的实现

鉴于柯里化函数的实用性，我们能否实现一个通用的柯里化工具函数？所谓通用，即该函数能将任意函数转换为柯里化形式。以下是第一版实现代码：


 // 第一版
var curry = function (fn) {
 var args = [].slice.call(arguments, 1);
 return function() {
  var newArgs = args.concat([].slice.call(arguments));
  return fn.apply(null, newArgs);
 };
};
 function add(a, b) {
  return a + b;
 }

var addFun = curry(add, 1, 2);
addFun() // 3
//或者
var addOne = curry(add, 1);

上述代码接收一个函数作为参数，并收集其余参数，将这些参数传递给原函数执行。然而，该实现存在参数灵活性不足的问题。例如，尝试如下调用时会报错：


var addFun = curry(function(a, b,c) {
 return a + b + c;
}, 1);
addFun(2)(3); // 报错 addFun(...) is not a function

这似乎违背了参数复用的初衷。对此进行改进，代码如下：


function curry(fn, args) {
 var length = fn.length;
 args = args || [];
 return function(...rest) {
  var _args = [...args, ...rest];
  return _args.length < length
   ? curry.call(this, fn, _args)
  : fn.apply(this, _args);
 }
}
var fn = curry(function(a, b, c) {
 console.log(a + b + c);
});
fn('a', 'b', 'c'); // abc
fn('a', 'b')('c'); // abc
fn('a')('b')('c'); // abc

改进后的实现更为完善，该工具函数的核心逻辑可总结为：

利用闭包机制存储函数参数，当收集到的参数数量达到原函数所需的总长度时，再执行原函数。

以上就是本文的全部内容，希望这对大家的学习有所帮助，也欢迎大家继续支持本站。

通过实例了解Javascript柯里化流程

函数式编程与柯里化概述

柯里化的基本概念与流程

柯里化的实际应用价值

通用柯里化函数的实现方案

实用工具推荐