广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >怎样用Javascript实现函数柯里化与反柯里化
  • 249
分享到

怎样用Javascript实现函数柯里化与反柯里化

2024-04-02 19:04:59 249人浏览 泡泡鱼
摘要

函数柯里化(黑人问号脸)???Currying(黑人问号脸)???妥妥的中式翻译既视感;下面来一起看看究竟什么是函数柯里化: 维基百科的解释是:把接收多个参数的函数变换成接收一个单一

函数柯里化(黑人问号脸)???Currying(黑人问号脸)???妥妥的中式翻译既视感;下面来一起看看究竟什么是函数柯里化:

维基百科的解释是:把接收多个参数的函数变换成接收一个单一参数(最初函数的第一个参数)的函数,并返回接受剩余的参数而且返回结果的新函数的技术。其由数学家Haskell Brooks Curry提出,并以curry命名。

概念往往都是干涩且难懂的,让我们用人话来解释就是:如果我们不确定这个函数有多少个参数,我们可以先给它传入一个参数,然后通过js闭包(如若不懂JS闭包,请先学习闭包知识点再来学习本篇博文https://www.cnblogs.com/dengyao-blogs/p/11475575.html)来进行返回一个函数,内部函数接收除开第一个参数外的其余参数进行操作并输出,这个就是函数的柯里化;

举个小例子:

场景(需求):

众所周知程序员每天加班的时间还是比较多的,如果我们需要计算一个程序员每天的加班时间,那么我们的第一反应应该是这样;


var overtime=0;
function time(x){
    return overtime+=x;
}

time(1);  //1
time(2);  //3
time(3);  //6

上面的代码固然没有问题,可是需要每天调用都算加一下当天的时间,很麻烦,并且每调用一次函数都要进行一定的操作,如果数据量巨大,有可能会有影响性能的风险,那么有没有可以偷懒又能解决问题的办法呢?有的!


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

var times=time(0);
times(3);

但是上面代码依然存在问题,在实际开发中很多时候我们的参数是不确定的,上面代码虽然简单的实现了柯里化的基本操作,但是对于参数不确定的情况是处理不了的;所以存在着函数参数的局限性;不过我们从上面的代码中基本可以知道函数柯里化是个啥意思了;就是一个函数调用的时候只允许传入一个参数,然后通过闭包返回内部函数去处理和接收剩余参数,返回的函数通过闭包的方式记住了time的第一个参数;

我们再来把代码改造一下:


//  首先定义一个变量接收函数
var overtime = (function() {
//定义一个数组用来接收参数
  var args = [];
//这里运用闭包,调用外部函数返回一个内部函数
  return function() {
  //arguments是浏览器内置对象,专门用来接收参数
  //如果参数的长度为0即没有参数的时候
    if(arguments.length === 0) {
    //定义变量用来累加
      var time = 0;
    //循环累加,用i和args的长度进行比较
      for (var i = 0, l = args.length; i < l; i++) {
    //进行累加操作   等价于time=time+args[i]
        time += args[i];
      }
    // 返回累加的结果
      return time;
    //如果arguments对象参数长度不为零,即有参数的时候
    }else {
    //定义的空数组添加arguments参数作为数组项,第一个参数古args作为改变this指向,第二个参数arguments把剩余参数作为数组形式添加至空数组中
      [].push.apply(args, arguments);
    }
  }
})();

overtime(3.5);    // 第一天
overtime(4.5);    // 第二天
overtime(2.1);    // 第三天
//...

console.log( overtime() );    // 10.1

代码经过我们的改造已经实现了功能,但是这不是一个函数柯里化的完整实现,那么我们要怎么完整实现呢?下面我们来介绍一种通用的实现方式:


//定义方法currying,先传入一个参数
var currying=function(fn){
  //定义空数组装arguments对象的剩余参数
  var args=[];
  //利用闭包返回一个函数处理剩余参数
  return function (){
    //如果arguments的参数长度为0,即没有剩余参数
    if(arguments.length===0){
    //执行上面方法
    //这里的this指向下面的s,类似于s(),代表参数长度为0的时候直接调用函数
      return fn.apply(this,args)
    }
    console.log(arguments)
  //如果arguments的参数长度不为0,即还有剩余参数
  //在数组的原型对象上添加数组,apply用来更改this的指向为args
  //将[].slice.call(arguments)的数组添加到原型数组上
  //这里的[].slice.call(arguments)===Array.prototype.slice.call(arguments)实质上就是将arguments对象转成数组并具有slice功能

   Array.prototype.push.apply(args,[].slice.call(arguments))
    //args.push([].slice.call(arguments))
    console.log(args)
  //这里返回的arguments.callee是返回的闭包函数,callee是arguments对象里面的一个属性,用于返回正被执行的function对象
    return arguments.callee
  }
}
  //这里调用currying方法并传入add函数,结果会返回闭包内部函数
  var s=currying(add);
  //调用闭包内部函数,当有参数的时候会将参数逐步添加到args数组中,待没有参数传入的时候直接调用
  //调用的时候支持链式操作
  s(1)(2)(3)();
//也可以一次性传入多个参数
   s(1,2,3);
  console.log(s());

JS函数柯里化的优点:

  • 可以延迟计算,即如果调用柯里化函数传入参数是不调用的,会将参数添加到数组中存储,等到没有参数传入的时候进行调用;
  • 参数复用,当在多次调用同一个函数,并且传递的参数绝大多数是相同的,那么该函数可能是一个很好的柯里化候选。

世间万物相对,有因必有果,当然了,有柯里化必然有反柯里化;

反柯里化(uncurrying),从字面意思上来讲就是跟柯里化的意思相反;其实真正的反柯里化的作用是扩大适用范围,就是说当我们调用某个方法的时候,不需要考虑这个对象自身在设计的过程中有没有这个方法,只要这个方法适用于它,我们就可以使用;(这里引用的是动态语言中的鸭子类型的思想)

在学习JS反柯里化之前,我们先学习一下动态语言的鸭子类型思想,以助于我们更好的理解:

动态语言鸭子类型思想(维基百科解释):

在程序设计中,鸭子类型(duck typing)是动态类型的一种风格。

在这种风格中,一个对象有效的语义,不是由继承自特定的类或实现特定的接口,而是由当前方法和属性的集合决定。

这个概念的名字来源于由 James Whitcomb Riley 提出的鸭子测试,“鸭子测试”可以这样表述:

当看到一只鸟走起来像鸭子、游泳起来像鸭子、叫起来也像鸭子,那么这只鸟就可以被称为鸭子。

理论上的解释往往干涩难懂,换成人话来说就是:你是你妈妈的儿子/女儿,不管你是否优秀,是否漂亮,只要你是你妈亲生的,那么你就是你妈的儿子/女儿;换成鸭子类型就是,只要你会呱呱叫,走起来像鸭子,只要你拥有的行为像鸭子,不管你是不是鸭子,那么你就可以被称为鸭子;

javascript中有很多鸭子类型的引用,比如我们在对一个变量进行赋值的时候,显然是不需要考虑变量的类型的,正是因为如此,Javascript才更加的灵活,所以Javascript是一门典型的动态类型语言;

我们来看一下反柯里化中是怎么引用鸭子类型的:


//函数原型对象上添加uncurring方法
Function.prototype.uncurring = function() {
//改变this的指向    
//这里的this指向是Array.prototype.push
  var self = this;
    //这里的闭包用来返回内部函数的执行
  return function() {
    //创建一个变量,在数组的原型对象上添加shift上面删除第一个参数
    //改变数组this的指向为arguments
    var obj = Array.prototype.shift.call(arguments);
    //最后返回执行并给方法改变指向为obj也就是arguments
   // 并传入arguments作为参数
    return self.apply(obj, arguments);
  };
};

//数组原型对象上添加uncurrying方法
var push = Array.prototype.push.uncurring();

//测试一下
//匿名函数自执行
(function() {
    //这里的push就是一个函数方法了
    //相当于传入参数arguments和4两个参数,但是在上面shift方法中删除第一个参数,这里的arguments参数被截取了,所以最后实际上只传入了4
  push(arguments, 4);
  console.log(arguments); //[1, 2, 3, 4]
//匿名函数自调用并带入参数1,2,3
})(1, 2, 3)

到这里大家可以想一想arguments是一个接收参数的对象,里面是没有push方法的,那么arguments为什么能调用push方法呢?

这是因为代码var push = Array.prototype.push.uncurring();在数组的原型对象的push方法上添加了uncurring方法,然后在执行匿名函数的方法push(arguments, 4);时候实质上是在调用上面的方法在Function的原型对象上添加uncurring方法并返回一个闭包内部函数执行,在执行的过程中因为Array原型对象上的shift方法会把push(arguments, 4);中的arguments截取,所以其实方法的实际调用是push(4),所以最终的结果才是[1,2,3,4]

在《JavaScript设计模式与开发实践》一书中,JS函数的反柯里化的案例是这样写的:


//定义一个对象
var obj = {
    "length":1,
    "0":1
}
//在Function原型对象定义方法uncurrying
Function.prototype.uncurrying = function() {
    //this指向Array.prototype.push
    var self = this;
    //闭包返回一个内部函数
    return function() {
    // 这里可以拆开理解
    //首先执行apply return 
    //Function.prototype.call(Array.prototype.push[obj,2])
   //然后Array.prototype.push.call(obj,2)
    //call改变指向  obj.push(2)
    //所以最后结果就是  {0: 1, 1: 2, length: 2}
        return Function.prototype.call.apply(self, arguments);
}
}

//在
var push = Array.prototype.push.uncurrying()

push(obj, 2) 
console.log(obj);
//{0: 1, 1: 2, length: 2}

上面的方式不好理解?没关系,咱们来个好理解的:


Function.prototype.unCurrying = function () {
    var self = this;
    return function () {
    //[].slice.call(arguments,1)===Array.prototype.push.slice.call(arguments,1)===arguments.slice(1)
return self.apply(arguments[0], [].slice.call(arguments, 1));
    };
};



var push = Array.prototype.push.uncurrying()
console.log(push);
push(obj,2) //{0: 1, 1: 2, length: 2}
console.log(obj);

分析一下:

1、首先在Function原型对象上添加uncurrying方法,这样所有的Function都可以借用;

2、返回一个闭包内部函数

3、闭包函数返回的结果中返回的是调用方法,self指向Array.prototype.push,apply方法中第一个参数是更改指向,对应下面push(obj,2)相当于更改指向为obj.push(2)

4、apply方法中第二个参数的call方法是更改指向为arguments,并且arguments中能使用slice方法,等于arguments.slice(1)

以上就是怎样用Javascript实现函数柯里化与反柯里化的详细内容,更多关于Javascript函数柯里化与反柯里化的资料请关注编程网其它相关文章!

--结束END--

本文标题: 怎样用Javascript实现函数柯里化与反柯里化

本文链接: https://www.lsjlt.com/news/124588.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 怎样用Javascript实现函数柯里化与反柯里化
    函数柯里化(黑人问号脸)???Currying(黑人问号脸)???妥妥的中式翻译既视感;下面来一起看看究竟什么是函数柯里化: 维基百科的解释是:把接收多个参数的函数变换成接收一个单一...
    99+
    2022-11-12
  • 如何使用Javascript实现函数柯里化与反柯里化
    这篇文章将为大家详细讲解有关如何使用Javascript实现函数柯里化与反柯里化,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。javascript是一种什么语言javascript是一种动态类型、弱类型的...
    99+
    2023-06-14
  • JavaScript函数柯里化
    目录1 什么是函数柯里化2 柯里化的作用和特点2.1 参数复用2.2 提前返回2.3 延迟执行3 封装通用柯里化工具函数#4 总结和补充1 什么是函数柯里化 在计算机科学中,柯里化(...
    99+
    2022-11-12
  • JavaScript 中怎么实现柯里化函数
    本篇文章为大家展示了JavaScript 中怎么实现柯里化函数,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。阶段1现在有一个加法函数:function a...
    99+
    2022-10-19
  • JavaScript如何实现函数柯里化
    这篇文章给大家分享的是有关JavaScript如何实现函数柯里化的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。函数柯里化的实现// 函数柯里化指的是一种将使用多个参数的...
    99+
    2022-10-19
  • JavaScript函数柯里化详解
    目录一、简单了解apply和call二、什么是函数柯里化?三、写一个公共的柯里化函数四、创建一个灵活的柯里化函数五、写一个可控制的执行时间的柯里化函数总结一、简单了解apply和ca...
    99+
    2022-11-12
  • JS函数怎么实现柯里化
    本篇文章给大家分享的是有关JS函数怎么实现柯里化,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。一、补充知识点之函数的隐式转换来一个简单的思考题。function fn...
    99+
    2023-06-15
  • JavaScript函数柯里化是什么
    这篇文章将为大家详细讲解有关JavaScript函数柯里化是什么,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。一、简单了解apply和callcall 和 apply 都...
    99+
    2022-10-19
  • JavaScript函数柯里化该怎么理解
    本篇文章给大家分享的是有关JavaScript函数柯里化该怎么理解,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。一、简单了解apply和callcall 和 apply 都是为...
    99+
    2023-06-26
  • JavaScript中的函数柯里化怎么使用
    这篇“JavaScript中的函数柯里化怎么使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“JavaScript中的函数柯...
    99+
    2023-07-06
  • JavaScript函数柯里化的示例分析
    这篇文章将为大家详细讲解有关JavaScript函数柯里化的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。函数柯里化使用方法:柯里化是函数式编程的一个重要技巧,将使用多个参数的一个函数转换成一系列...
    99+
    2023-06-27
  • 一文带你了解JavaScript函数柯里化
    目录一、定义二、柯里化函数的作用1、参数复用2、提前确认3、延迟执行三、柯里化函数的实现四、柯里化总结性能方面:应用场景:一、定义 柯里化(Currying)是把接受多个参数的函数变...
    99+
    2023-02-01
    JavaScript函数柯里化 JavaScript 柯里化
  • 深入了解JavaScript中的函数柯里化
    目录一、参数复用二、延迟执行三、部分应用四、函数组合JavaScript函数柯里化是一种将接受多个参数的函数转换为一系列接受单个参数的函数的技术。这种技术可以让我们更方便地创建可复用...
    99+
    2023-05-16
    JavaScript函数柯里化 JavaScript 柯里化
  • JavaScript函数柯里化如何使用占位符
    小编给大家分享一下JavaScript函数柯里化如何使用占位符,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!函数柯里化(支持占位符)使用方法:通过占位符能让柯里化...
    99+
    2023-06-27
  • JavaScript中函数柯里化的原理是什么
    今天就跟大家聊聊有关JavaScript中函数柯里化的原理是什么,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。柯里化是这样的一个转换过程,把接受多个...
    99+
    2022-10-19
  • 前端JavaScript彻底弄懂函数柯里化curry
    目录一、什么是柯里化( curry)二、柯里化的用途三、如何封装柯里化工具函数 一、什么是柯里化( curry) 在数学和计算机科学中,柯里化是一种将使用多个参数的一个函数转换成一系...
    99+
    2022-11-12
  • JavaScript中的高阶函数和柯里化以及组合函数是怎样的
    这期内容当中小编将会给大家带来有关JavaScript中的高阶函数和柯里化以及组合函数是怎样的,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。面向对象编程和函数式编程是两种...
    99+
    2022-10-19
  • JavaScript中的函数式编程函数和组合以及柯里化是怎样的
    JavaScript中的函数式编程函数和组合以及柯里化是怎样的,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。面向对象编程和函数式编程是两种非常...
    99+
    2022-10-19
  • 从柯里化分析JavaScript重要的高阶函数实例
    目录前情回顾百变柯里化缓存传参缓存判断缓存计算缓存函数防抖与节流lodash 高阶函数结语前情回顾 我们在前篇 《✨从历史讲起,JavaScript 基因里写着函数式编程》 讲到了 ...
    99+
    2022-11-13
    JavaScript 柯里化高阶函数 JavaScript 高阶函数
  • react中事件处理与柯里化的实现
    目录1. 事件处理阻止默认行为合成事件2. 柯里化柯里化的目的一个简单的例子1. 事件处理 React 中元素也可接受、处理事件,但是在语法上有一点不同。 在React 中所有事件的...
    99+
    2022-11-13
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作