首页 > 编程语言 >JavaScript函数柯里化

JavaScript函数柯里化

时间:2023-02-17 19:55:05浏览次数:42  
标签:... JavaScript 函数 args 参数 柯里化 fn

首先说一下什么是函数柯里化吧

 

函数柯里化:一种将多参数函数转换成一系列使用一个参数的函数的技术,它在函数式编程中非常常见

执行的条件:通用的柯里化函数,它接收一个函数作为参数,返回一个新函数,新函数可以接收任意数量的参数,当参数数量足够后,就会执行传入的函数

 

下面的例子牵扯到的技术包括:函数递归、bind函数、扩展运算符

function curry(fn, ...args) {
  if (args.length >= fn.length) {
    return fn(...args);
  }
  return function(...newArgs) {
    return curry(fn, ...args, ...newArgs);
  };
}

 

if (args.length >= fn.length) return fn(...args);

在这个代码中,fn 是需要被柯里化的函数,args 是已经传递的部分参数。
当函数 `fn` 的参数数量大于等于 `args` 的长度时,说明所有参数都已经收集齐了,此时就可以直接调用 `fn` 并传入收集到的所有参数,返回结果

 

return function(...newArgs) {
return curry(fn, ...args, ...newArgs);
};

否则,返回一个新的函数,这个函数会接收一个新的参数 newArgs,并使用 curry 函数递归地调用自身。
在这个新函数内部,`args` 和 `newArgs` 会被合并起来,继续等待下一次的调用,直到所有参数被收集完毕,返回结果。
这个过程中,每次调用都会返回一个新的函数,这就是柯里化函数的“柯里化链”,通过链式调用的方式可以逐步收集所有的参数。

这种实现方式具有很好的灵活性和可扩展性,可以适用于不同的函数,不同的参数列表。

 

 

这个是注释后的内容,运行环境VUE3.2你也可以打Debugger查看运行

// 计数器
let count = ref(0);

// 函数进行柯里化 , 柯里化函数的核心逻辑,实现了将一个多参数函数转换为一系列只接受单一参数的函数的过程
function curry(fn, ...args) {
    // args接收的参数是一个一维数组,需要使用扩展运算符展开...

    // 计数器可得知curry函数回调了3次,第一次传入function 2,第二次传入function 2 10 第三次调用
    ++count.value;

    // 当函数 fn 的参数数量大于等于 args 的长度时,说明所有参数都已经收集齐了,此时就可以直接调用 fn 并传入收集到的所有参数,返回结果
    if (args.length >= fn.length) return fn(...args);
    
    // 否则,返回一个新的函数,这个函数会接收一个新的参数 newArgs(也就是传入的值)
    return function(...newArgs) {
        // 在这个新函数内部,args 和 newArgs 会被合并起来,继续等待下一次的调用,直到所有参数被收集完毕,返回结果,
        // 这个过程中,每次调用都会返回一个新的函数,这就是柯里化函数的“柯里化链”,通过链式调用的方式可以逐步收集所有的参数
        
        // 执行第一次function 2、 第二次 function 2 10
        return curry(fn, ...args, ...newArgs);
    };
}

// 普通函数
function add(a, b) {
    return a + b;
}

// 1. 传入普通函数
const curriedAdd = curry(add);
// 2. 传入预设值
const add2 = curriedAdd(2);
// const add3 = curriedAdd(3);
// 3. 调用
console.log(add2(3));

 

 

 

标签:...,JavaScript,函数,args,参数,柯里化,fn
From: https://www.cnblogs.com/cisum/p/17131387.html

相关文章

  • 在VScode中引入JAVASCript的方式
    打开VSCODE,创建一个html文件夹,shift+!快速创建代码。创建js文件,然后可以在里面定义变量,函数然后在html文件body中引入javaScript ......
  • javascript 高级编程系列 - 迭代器/生成器
    1.迭代器(Iterator)特殊对象,具有迭代过程的接口next()方法每次调用next()方法,返回一个结果对象结果对象有两个属性value(任何类型)和done(布尔类型)当集合的值返回完时......
  • vue 侦听器以及副作用函数使用
    侦听器格式函数格式缺点无法在刚进入页面的时候自动触发。如果监听了一个对象,那就无法监听对象内部属性变化watch:{username(newVal){......
  • python入门之函数function
    """函数function定义:功能,使用一个名称,包装多个语句语法:做def名字(形参):函数体......
  • 函数
    函数性质单射:y=kx+b,一个x只对应唯一一个y,但y可以对应多个x一一对应:若x1!=x2,则y1!=y2(只有一一对应函数才有反函数)函数的有界性非空实数集E中,有实数M,m若存在实数M,满足有X......
  • 函数式编程-Supplier 在实际环境的使用(二)
    有种简洁的Supplier写法如下所示:publicclassSupplierHandler{publicvoidhandler(Supplier<UserInfo>suppplier){//这里面获取数据UserIn......
  • python中lambdas匿名函数的用法
    匿名函数相信大家都听说过,本篇将会从表达式的使用入手,帮助大家快速掌握lambdas匿名函数的用法。1、lambdasx是指lambdas关键字和使用的变量,冒号后为函数的表达式。2、逗号......
  • python单元测试中的函数整理
    1、setUp准备环境。执行每个测试用例的前提条件。2、tearDown恢复环境。执行每个测试用例的后置条件。3、setUpClass所有case执行的前置条件,只运行一次。必须使用@classmeth......
  • JavaScript常见问题梳理
    1、this指向1、全局函数this指向全局对象window,注意严格模式下,this为undefined//[objectWindow]alert(this);functionf(){alert(this)}f()//undefinedfu......
  • javascript的一些基础知识
    随手记录一些javascript的一些基础知识,之前只是简单用到javascript,并没有了解其中的概念。1. JavascriptObject:InJavaScript,almost"everything"isanobject.......