函数柯里化的简单实现和应用

已于 2023-10-01 19:39:20 修改
阅读量284 收藏 1
点赞数 1
分类专栏： JavaScript面试问题 闭包 函数的高级应用 文章标签： javascript 前端 函数
于 2023-10-01 01:21:20 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42750608/article/details/133446241
版权
本文详细介绍了柯里化函数的两种实现方式（基于`length+arguments+apply`和扩展运算符），以及非柯里化的偏函数和反柯里化方法。通过实例展示了如何使用这些技巧计算总和并进行数组操作，如克隆和生成类数组。
摘要由CSDN通过智能技术生成

一. 柯里化函数实现:

1. 使用函数的length+arguments+apply的相关知识

var slice = Array.prototype.slice
var curry = function (fn) {
    // 拿到fn参数之后的参数
    var args = slice.call(arguments, 1)
    return _curry.apply(this, [fn, fn.length].concat(args))
}

function _curry(fn, len) {
    // 获取fn, len之外的其他参数
    var oArgs = slice.call(arguments, 2);
    return function () {
        var args = oArgs.concat(slice.call(arguments))
        if (args.length >= len) {
            return fn.apply(this, args)
        }
        else {
            return _curry.apply(this, [fn, len].concat(args))
        }
    }
}

2. 使用函数的length + 扩展运算符...  + apply的知识:

var curry = function (fn, ...arg1) {
    const len = fn.length
    return _curry.apply(this, [fn, len, ...arg1])
}

function _curry(fn, len, ...rest1) {
    return function (...rest2) {
        var args = [...rest1, ...rest2]
        if (args.length >= len) {
            return fn.apply(this, args)
        }
        else {
            return _curry.apply(this, [fn, len].concat(args))
        }
    }
}

实例运用:

测试计算总和的功能:

function calcSum(num1, num2, num3) {
    return num1 + num2 + num3
}

var calcSum2 = function (...args) {
    // const arr = Array.from(arguments);
    const arr = Array.prototype.slice.call(arguments, 0);
    // const arr = Array.of(...args);
    let sum = 0;
    return arr.reduce((obj, cur) => {
        sum = obj + cur
        return sum
    }, sum)
}

const log = console.log
var len1 = 1
var calcSumCurry = _curry(calcSum2, 4)
log(calcSumCurry(3, 4, 5, 6))// 18
log(calcSumCurry(3)(4)(5)(6))//18
log(calcSumCurry(3)(4, 5)(6))//18

var calcSumCurry = curry(calcSum, 3)
log(calcSumCurry(4, 5))//12 
log(calcSumCurry(4)(5))//12

每次只要在最后执行空参函数, 就开始计算, 下一次重新开始

function _curry(fn, len) {
    var oArgs = slice.call(arguments, 2);
    return function () {
        var args = oArgs.concat(slice.call(arguments));
        if (arguments.length === 0) {
            if (args.length >= len) {
                return fn.apply(this, args);
            }
            return console.warn('curry: 参数长度不足')
        }

        return _curry.apply(this, [fn, len].concat(args))
    }
}

var calcSum2 = function (...args) {
    // const arr = Array.from(arguments);
    const arr = Array.prototype.slice.call(arguments, 0);
    // const arr = Array.of(...args);
    let sum = 0;
    return arr.reduce((obj, cur) => {
        sum = obj + cur
        return sum
    }, sum)
}

const log = console.log
var calcSumCurry = _curry(calcSum2, 4)
// 每次都从头开始算
log(calcSumCurry(3, 4, 5, 6)())// 18
log(calcSumCurry(3)(4)(5)(6)())//18
log(calcSumCurry(3)(4, 5)(6)())//18
log(calcSumCurry(3)(4, 5)()) // curry: 参数长度不足

想要一直累加:

var slice = Array.prototype.slice
function curry(fn, len0) {
    const curArgs = []
    const len = len0 || fn.length
    return function () {
        if (arguments.length === 0) {
            if (curArgs.length >= len) return fn.apply(this, curArgs)

            return console.warn('curry: 参数长度不足')
        }
        Array.prototype.push.apply(curArgs, [].slice.call(arguments));
        return arguments.callee;
    }
}

var calcSum2 = function (...args) {
    // const arr = Array.from(arguments);
    const arr = Array.prototype.slice.call(arguments, 0);
    // const arr = Array.of(...args);
    let sum = 0;
    return arr.reduce((obj, cur) => {
        sum = obj + cur
        return sum
    }, sum)
}

const log = console.log

var calcSumCurry = curry(calcSum2, 4)
log(calcSumCurry(3, 4, 5)())// curry: 参数长度不足
log(calcSumCurry(4)(5)())// 21

严格模式下callee会报错, 可以改成:

'use strict'

var slice = Array.prototype.slice
function curry(fn, len0) {
    const curArgs = []
    const arg2 = []
    const len = len0 || fn.length
    let tag = 'start'
    return function start () {
        if (arguments.length === 0) {
            if (curArgs.length >= len) {
                if(tag === 'end') return console.warn('curry: 参数长度不足, 请核对参数后重试')
                return fn.apply(this, curArgs)
            }
            
            tag = 'end'
            // 只有第一次执行计算的时候才会判断参数长度是否足够
            return console.warn('curry: 参数长度不足')
        }
        Array.prototype.push.apply(curArgs, [].slice.call(arguments));
        return start;
    }
}

var calcSum2 = function (...args) {
    const arr = Array.prototype.slice.call(arguments, 0);
    let sum = 0;
    return arr.reduce((obj, cur) => {
        sum = obj + cur
        return sum
    }, sum)
}

const log = console.log

var calcSumCurry = curry(calcSum2, 4)
log(calcSumCurry(3, 4, 5)()) // curry: 参数长度不足
log(calcSumCurry(4)(5)()) // 参数长度不足, 请核对参数后重试

柯里化log方法:

var slice = Array.prototype.slice;
var curry = function (fn, length) {
    var args = slice.call(arguments, 2)
    return _curry.apply(this, [fn, length || fn.length].concat(args))
};

function _curry(fn, len) {
    var oArgs = slice.call(arguments, 2);
    return function () {
        var args = oArgs.concat(slice.call(arguments));
        if (args.length >= len) {
            return fn.apply(this, args);
        } else {
            return _curry.apply(this, [fn, len].concat(args))
        }
    }
}


function log(logLevel, msg) {
    console.log(`${logLevel}:${msg}:::${Date.now()}`)
}

//柯里化log 方法
const curryLog = curry(log);

const debugLog = curryLog("debug");

const errLog = curryLog("error");

//复用参数debug
debugLog("testDebug1");//debug:testDebug1:::1696145622354
debugLog("testDebug2");//debug:testDebug2:::1696145622360

//复用参数error
errLog("testError1");//error:testError1:::1696145622360
errLog("testError2");//error:testError2:::1696145622360

二. 非柯里化的实现方式:

1. 偏函数

偏函数求和:

// 偏函数
function partial(fn) {
    // 接受fn之外的参数
    const args = [].slice.call(arguments, 1)
    return function () {
        // 接收剩余参数
        const newArgs = args.concat([].slice.call(arguments));
        return fn.apply(this, newArgs)
    }
}

function calcSum(...args) {
    const arr = [...args]
    let sum = 0;
    return arr.reduce((obj, cur) => {
        sum = obj + cur
        return sum
    }, sum)
}

// 偏函数是固定一部分参数(一个或者多个参数), 将一个N元函数转换为一个N-X函数
const pCalcSum = partial(calcSum, 10);
console.log(pCalcSum(11, 12))//33

2. 反柯里化

1. 反柯里化方法的几种写法:

Function.prototype.unCurry=function() {
    var self = this
    return function() {
        return Function.prototype.call.apply(self, arguments)
    }
}

Function.prototype.unCurry=function() {
    return this.call.bind(this)
}

Function.prototype.unCurry=function() {
    return (...args) => this.call(...args)
}

2. 反柯里化实例运用:

1) 克隆数组
function unCurry1(fn) {
    return function(context) {
        // this换成传入的参数context, context之外的参数作为apply的剩余参数
        return fn.apply(context, Array.prototype.slice.call(arguments, 1));
    }
}

Function.prototype.unCurry = function () {
    const self = this
    return function() {
        return Function.prototype.call.apply(self, arguments)
    }
}


// 复制数组
var clone = Array.prototype.slice.unCurry()
var a = [1, 2, 3]
var b = clone(a);

console.log('a == b', a === b); // 除非引用一样, 否则都是false
console.log(a, b);//[ 1, 2, 3 ] [ 1, 2, 3 ]

var slice = [].slice
var clone = unCurry1(slice)
var a = [1, 2, 3]
var b = clone(a);
console.log('a == b', a === b); // 除非引用一样, 否则都是false
console.log(a, b);//[ 1, 2, 3 ] [ 1, 2, 3 ]
2) 生成类数组
function unCurry1(fn) {
    return function(context) {
        // this换成传入的参数context, context之外的参数作为apply的剩余参数
        return fn.apply(context, Array.prototype.slice.call(arguments, 1));
    }
}

Function.prototype.unCurry = function () {
    const self = this
    return function() {
        return Function.prototype.call.apply(self, arguments)
    }
}
var push = Array.prototype.push.unCurry();
var obj = {}
// console.log(Array.prototype.slice.call({0:1, length: 1}, 0))//[1]
push(obj, 4, 5, 6); // 对象变成了类数组
console.log(obj)//{ '0': 4, '1': 5, '2': 6, length: 3 }

var obj = {}
unCurry1([].push)(obj, 7, 8, 9, 10)
console.log(obj)//{ '0': 7, '1': 8, '2': 9, '3': 10, length: 4 }

qq_42750608
关注
专栏目录
什么是函数柯里化，函数柯里化的应用场景，函数柯里化的优缺点
angrynouse的博客
10-03 987
什么是函数柯里化？
Javascript闭包与函数柯里化浅析
10-22
JavaScript中的闭包和函数柯里化是两种强大的技术，它们都是函数式编程的重要组成部分。闭包是一种机制，允许函数访问并操作其外部作用域的变量，即使在其定义的上下文之外。而函数柯里化是一种将多参数函数转换为一...
ES6如何用一句代码实现函数的柯里化
11-21
柯里化是干什么的？首先看看下面这个函数 let store = (a,b,c) => "这是你的七仔面" //函数就好像一个小卖部，一碗七仔面要三张软妹币：a,b,c (五个参数) 那函数柯里化是什么？就是我们买面吃的过程可能是这样： let curryStore = curry(store) //刚刚的小卖部被柯里化了 //最佳状况 curryStore(1,5,1)// 老板，刚好！不用找了，刚好七块钱。老板： "这是你的七仔面" //偶尔出现的情况 let boss = curryStore(5) //老板，这五块钱你先拿着，我找找有没有一块钱。老板：…… boss = boss
一文了解什么是函数柯里化
最新发布
前端梦工厂
03-13 1279
函数柯里化是一种将使用多个参数的函数转换为一系列使用一个参数的函数的技术。该技术的名称来自于数学家`Haskell Curry`。
js函数柯里化代码的实现
pierresj的博客
08-21 551
/** * 函数柯里化代码的实现 * 把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术 * 利用了闭包,该函数是个立即执行函数， * 返回了一个新函数，而这个新函数实际上就是一个闭包， * 这个新函数把每次接收到的参数都存储起来， * 并且继续返回一个新函数，当发现某次调用的时候没有传入参数， * 那就意味着要...
scala详细笔记(十)-scala高级语法之柯里化和闭包
HANG.NIAN
06-27 2753
1 柯力化 1.1 简介 语法 : 函数有多个参数列表 柯里化(Currying)指的是把原来接受多个参数的函数变换成接受一个参数的函数过程，并且返回接受余下的参数且返回结果为一个新函数的技术。所以柯力化的现象是 : 函数名()() 意义: 方便数据的演变, 后面的参数可以借助前面的参数推演 , foldLeft的实现 有多个参数列表 的函数就是柯里化函数，所谓的参数列表就是使用小括号括起来的函数参数列表 curry化最大的意义在于把多个参数的function等价转化成多个单参数funct..
柯里化函数的实现
qq_40060116的博客
03-13 885
什么是柯里化函数 引用百度百科中对柯里化的解释 柯里化（Currying）是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术。 用经典的加法器来举例 function add(a, b) { return a + b; } add(1, 2); // 3 这是一个最简单的加法函数，作用是把传入的a,b两个参数相加并把相加后的结果返回。 下面我们用柯里化的思想对这个函数进行改写。 function add(a)
函数柯里化怎么实现
hans774882968的博客
09-23 888
柯里化是一种转换，将 f(a,b,c) 转换为可以被以 f(a)(b)(c) 的形式进行调用。JavaScript实现通常都保持该函数可以被正常调用，并且如果参数数量不足，则返回偏函数。 既然柯里化能知道参数数量是否足够，那么显然它只允许确定参数长度的函数，再强调一遍： 柯里化要求函数具有固定数量的参数。使用 rest 参数的函数，例如 f(...args)，不能以这种方式进行柯里化。 柯里化实现 首先，function有name和length这两种常用属性 function f(a,b,...args){
函数柯里化的实现
csD_Dscnnnnnnn的博客
03-25 744
函数柯里化的实现
JavaScript函数柯里化原理与用法分析
10-20
函数柯里化（Currying）是函数式编程中的一个概念，它的核心思想是将多参数函数转换为一系列单参数函数。这个概念最初由数学家 Haskell Curry 提出，因此得名。在 JavaScript 中，函数柯里化可以让我们更灵活地控制...
js代码-函数柯里化
07-16
在JavaScript中，我们可以使用闭包来实现函数柯里化。一个简单的例子是： ```javascript function curry(fn) { const args = []; return function curried() { args.push(...arguments); if (args.length ) ...
javascript实现函数柯里化与反柯里化过程解析
10-16
【函数柯里化】 函数柯里化是函数式编程中的一个重要概念，源自数学家Haskell Brooks Curry的名字。它的核心思想是将一个接受多个参数的函数转换为一系列只接受一个参数的函数，每次调用返回一个新的函数，直到所有...
实现一个通用的函数柯里化的函数
Curry_On的博客
11-23 804
这篇文章会一步一步带你实现一个通用的函数柯里化的函数，即使你完全不懂柯里化这个概念也没关系，我会先介绍柯里化函数的概念，然后以**实现一个完整的判断变量类型的函数**的例子来让你直观体验函数柯里化，然后再实现一个通用的函数柯里化函数。
js实现函数的柯里化
xiaolu289的博客
06-16 715
/** * 递归返回包装函数 * @param {Function} fn * @param {Array} args */ var funcWraper = function(fn,args) { var needArgs = fn.length; return function() { var newArgs = Array.prototype.s...
函数柯里化
原鑫的个人博客
10-10 598
函数柯里化 柯里化主要从某种意义上，应用的闭包的概念，将值存起来，其次满足柯里化的条件就是需要返回一个函数 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /&gt
柯里化实现
旧忆时光的博客
02-21 368
什么是柯里化 函数柯里化（curry）是函数式编程里面的概念：只传递给函数一部分参数来调用它，让它返回一个函数去处理剩下的参数。 每次调用函数时，只接受一部分参数，并返回一个函数，直到传递所有参数为 ...
js 常见方法实现----函数柯里化实现
WenYuShuang的博客
03-19 750
函数柯里化 通用实现 function curry(fn, ...args) { if (args.length >= fn.length) return fn(...args); return function (...args2) { return curry(fn, ...args, ...args2); } } 概念（wiki）： curring 是把接受多个...
使用postcss-pxtorem插件实现px转换rem
qq_42750608的博客
09-21 3832
使用postcss-pxtorem插件实现px转换rem
掌握JS函数柯里化的核心技巧与应用
资源摘要信息:"JavaScript函数柯里化是一种编程技术，用于将一个接收多个参数的函数转换成一系列...在处理类似的文件时，开发者需要阅读文档来理解函数柯里化的实现细节和使用方式，以及任何特定的实现要求或依赖关系。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值