了解下函数柯力化

495 阅读3分钟

1、简介

JavaScript函数柯里化(Currying)是一种函数式编程技术,它允许我们将一个带有多个参数的函数转化为一系列只接收单一参数的嵌套函数,从而更加灵活地使用和复用函数。

2、简单实现

function add(x) {
  return function(y) {
    return x + y;
  }
}

const addFive = add(5);
console.log(addFive(3)); // 输出 8

       在上面的例子中,我们定义了一个 add 函数,该函数接收一个参数 x,然后返回一个嵌套的函数,该函数接收一个参数 y 并返回 x+y 的值。通过调用 add(5),我们创建了一个新的函数 addFive,它接收一个参数 y 并将其加上 5。

       柯里化的优点在于它使得我们可以轻松地创建可复用的函数模板,通过传递一部分参数来生成一个新的函数。例如,如果我们需要编写一个处理货币转换的函数,我们可以柯里化该函数以接收货币汇率作为参数,并生成一系列可用于处理不同货币转换的函数:

function convertCurrency(rate) {
  return function(amount) {
    return amount * rate;
  }
}

const convertUSD = convertCurrency(0.85); // 1美元=0.85欧元
const convertGBP = convertCurrency(1.17); // 1英镑=1.17欧元

console.log(convertUSD(10)); // 输出 8.5
console.log(convertGBP(10)); // 输出 11.7

       在上面的例子中,我们定义了一个 convertCurrency 函数,该函数接收一个汇率参数 rate,并返回一个嵌套的函数,该函数接收一个金额参数 amount 并返回换算后的金额。我们使用该函数创建了两个新的函数,convertUSD 和 convertGBP,它们分别将美元和英镑转换为欧元。

       除了以上的应用场景之外,柯里化还可以用于延迟函数执行。例如,如果我们需要在浏览器中添加一个事件处理程序,但希望在事件被触发时执行函数之前等待一段时间,我们可以柯里化该函数以接收延迟时间作为参数,并返回一个嵌套的函数,该函数接收事件对象并在指定延迟时间后执行:

function delay(callback, time) {
  return function(event) {
    setTimeout(function() {
      callback(event);
    }, time);
  }
}

function handleClick(event) {
  console.log('clicked!', event);
}

const delayedClick = delay(handleClick, 1000); // 延迟1秒钟执行
document.addEventListener('click', delayedClick);

       在上面的例子中,我们定义了一个 delay 函数,该函数接收一个回调函数和一个时间参数,并返回一个嵌套的函数,该函数接收事件对象并在指定的时间后执行回调函数。我们使用该函数将延迟后执行的函数 delayedClick 添加到 document 对象的 click 事件监听器中,这样当用户点击页面时,事件处理程序就会延迟执行,从而实现了延迟执行的效果。

3、总结

       总结来说,JavaScript 函数柯里化是一种非常有用的技术,它可以帮助我们更加灵活地使用和复用函数。通过柯里化,我们可以轻松地创建可复用的函数模板,延迟函数执行,以及处理各种需要接收多个参数的场景。