iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > html >web开发中函数柯里化的示例分析
  • 646
分享到

web开发中函数柯里化的示例分析

2024-04-02 19:04:59 646人浏览 八月长安
摘要

这篇文章给大家分享的是有关web开发中函数柯里化的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。前言函数柯里化就是将多参简化为单参数的一种技术方式,其最终支持的是方法的连

这篇文章给大家分享的是有关web开发中函数柯里化的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

前言

函数柯里化就是将多参简化为单参数的一种技术方式,其最终支持的是方法的连续调用,每次返回新的函数,在最终符合条件或者使用完所有的传参时终止函数调用。

场景实例

与其他文章不同,我在本文会重点分享一些柯里化的经典使用场景,让你在学会这点技巧后能切实的提升代码的可维护性。

编写可重用小模块代码

比如我们有个方法部分逻辑前置是相同的,后面的执行是因为参数不同导致结果不同的,下面是代码部分。
计算商品的折扣,我们需要根据不同的折扣以及商品的入参返回其实际的价格。

// before
function getPrice(price,discount){
	return price * discount;
}

let price = getPrice(500,0.1);


// after 
function getPrice(discount){
	return price =>{
 	return price * discount
 }
}
// 使用,在这种使用效果下,我们可以固定的肢解拿到百分之十折扣的函数,
//也就是针对使用0.1折扣的商品价格都可以简化这个折扣的传递,从而达到简化参数的目的
//那么从函数的运行上来讲,也比之前的效率高了,如果解析折扣的过程比较复杂
let tenDiscount = getPrice(0.1);
let price = tenDiscount(500);

let price = getPrice(0.1)(500)

看上去有点鸡肋,因为我们本来的写法很简单,使用了柯里化反而让简单的事情变得复杂了,这主要是因为没有达到我们要把一个函数变成柯里化的经典场景。假如你下面的代码变成了下面这样,也许你就能觉察出如果有使用柯里化就会非常方便了,因为针对第一个参数做了若干的处理,甚至可以称为一个算法或者完整的逻辑判断流程,那么如果有多个参数调用都涉及这个方法的调用,同一个参数的这部分逻辑是相同可以共用跳过的。codepen连接:链接

// complexed fun 
function getPriceComplex(price,discount){
 let actualDiscount = 1;
 if(discount > 0.8 ) {
 	actualDiscount = 0.8;
 } else if(discount > 0.5){
 	actualDiscount = 0.5;
 } else {
 actualDiscount = 0.1;
 }
 let actualPrice = price - price % 100 ;
	return actualPrice * actualDiscount;
}

// complexed fun better
function getPriceComplexBetter(discount){
 let actualDiscount = 1;
 if(discount > 0.8 ) {
 	actualDiscount = 0.8;
 } else if(discount > 0.5){
 	actualDiscount = 0.5;
 } else {
 actualDiscount = 0.1;
 }
 return price => {
 	 let actualPrice = price - price % 100 ;
			return actualPrice * actualDiscount;
 }
}


console.log(getPriceComplex(500,0.9))
let exp1 = getPriceComplexCp(0.9);
console.log(exp1);

// 相同的输入参数时 可以缓存下之前代码逻辑的执行结果 实现模块的可重用,如果你之前的逻辑是一个纯函数
console.log(exp1(500))// 400
console.log(exp1(400))// 320


// get real discount 
// 当你针对第一个参数的逻辑较为复杂时,出于可维护角度,建议如此 ;
// 当你另外一个逻辑也是基于这个返回结果时,出于重用角度,建议如此
function getActualDiscount(discount){
 let actualDiscount = 1;
 if(discount > 0.8 ) {
 	actualDiscount = 0.8;
 } else if(discount > 0.5){
 	actualDiscount = 0.5;
 } else {
 actualDiscount = 0.1;
 }
 return actualDiscount;
}
// complexed fun best
function getPriceComplexBest(discount){
 let actualDiscount =getActualDiscount(discount);
 return price => {
 	 let actualPrice = price - price % 100 ;
			return actualPrice * actualDiscount;
 }
}

总结,无论如何,我们使用某种技巧或者封装或者其他,都是为了让代码更可用,原先复杂不可测试、不可理解的代码变得更有调理,更节省性能的角度出发的,当你的思维方式中有这种的时候,你就不会觉得是为了形式而使用,而是你的编码习惯或者风格就是如此。

简单改造普通函数为柯里

假如我们需要把一个原来非柯里的函数如何快速改造,在不影响原来主要代码逻辑的情况下,想下我们代码可能如何写?

// 只考虑两个参数
function add(a,b){
 return a + b
}

// 但如果你是用柯里化的方式:两个参数的时候 ,但这样对原代码变动非常大,对于一些复杂的逻辑,这基本不可能
function curryAdd(...args){
 return (...newArgs) => {
 	return anoNumber * number;
 };
}

// 我们写一个通用的柯里化函数的方式,经过这个函数的转换,我们可以将调用方式简化
function curry = (fn,...args){
	return (..._args)=>{
 	return fn(...args, ..._arg);
 }
}

let curryAdd = curry(add,10);
let curryAdd2 = curryAdd(11)

不定参数的累加

一个比较经典的练手题,把下面的代码用柯里化的方式实现,其难点简单分析如下:如果你没有了解过柯里化,可能觉得基本无法完成。

1 动态入参个数,这个也许还可以通过arguments循环完成2 每次都能接受新的参数继续累加,这必须是返回新函数并带有之前的结果,要求是具有柯里化特点3 每次不在追加参数时,需要能得到的值,这个需要你了解toString方法来改变结果值

实现一个add方法,使计算结果能够满足如下预期: add(1)(2)(3) = 6

add(1, 2, 3)(4) = 10

add(1)(2)(3)(4)(5) = 15

function add() {
 // 第一次执行时,定义一个数组专门用来存储所有的参数
 var _args = [].slice.call(arguments);
 // 在内部声明一个函数,利用闭包的特性保存_args并收集所有的参数值,执行时已经收集所有参数为数组
 var adder = function () {
  var _adder = function() {
   // 执行收集动作,每次传入的参数都累加到原参数
   [].push.apply(_args, [].slice.call(arguments));
   return _adder;
  };
  // 利用隐式转换的特性,当最后执行时隐式转换,并计算最终的值返回
  _adder.toString = function () {
   return _args.reduce(function (a, b) {
    return a + b;
   });
  }
  return _adder;
 }
 return adder(_args);
}

备注:codepen中的console.log方法被重写,会有报错的问题,你可以直接通过浏览器的console控制台调试这个方法。

部分参数应用

部分参数应用是指有些场景是希望固定传递多个参数,来得到其固定的函数,然后基于这个函数去执行代码。类似于第一个例子中的一个折扣参数得出折扣算法的使用。我们将第一个例子再复杂化一些。就会变成这样的。

function getActualDiscount(custoemrLevel,discount){
	
}
function getPriceComplex (custoemrLevel,discount){
	let actualDiscount = getActualDiscount(custoemrLevel,discount);
 return price=>{
 	return price * actualDiscount;
 }
}
// 等级一的折扣策略 
let strategyLev1WithOnepoint = getPriceComplex('lev1',0.1) ;
let actualPrice = strategyLev1WithOnepoint(500);

感谢各位的阅读!关于“WEB开发中函数柯里化的示例分析”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

--结束END--

本文标题: web开发中函数柯里化的示例分析

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

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

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

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

下载Word文档
猜你喜欢
  • web开发中函数柯里化的示例分析
    这篇文章给大家分享的是有关web开发中函数柯里化的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。前言函数柯里化就是将多参简化为单参数的一种技术方式,其最终支持的是方法的连...
    99+
    2024-04-02
  • JavaScript函数柯里化的示例分析
    这篇文章将为大家详细讲解有关JavaScript函数柯里化的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。函数柯里化使用方法:柯里化是函数式编程的一个重要技巧,将使用多个参数的一个函数转换成一系列...
    99+
    2023-06-27
  • JS中柯里化currying的示例分析
    这篇文章主要为大家展示了“JS中柯里化currying的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JS中柯里化currying的示例分析”这篇文章吧...
    99+
    2024-04-02
  • Javascript柯里化流程的示例分析
    这篇文章将为大家详细讲解有关Javascript柯里化流程的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。函数式编程是一种如今比较流行的编程范式,它主张将函数作为...
    99+
    2024-04-02
  • web开发中rbac的示例分析
    这篇文章主要为大家展示了“web开发中rbac的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“web开发中rbac的示例分析”这篇文章吧。   //登...
    99+
    2024-04-02
  • web开发中页面静态化的示例分析
    这篇文章给大家分享的是有关web开发中页面静态化的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。   public void GenerathHtmlByString(...
    99+
    2024-04-02
  • 从柯里化分析JavaScript重要的高阶函数实例
    目录前情回顾百变柯里化缓存传参缓存判断缓存计算缓存函数防抖与节流lodash 高阶函数结语前情回顾 我们在前篇 《✨从历史讲起,JavaScript 基因里写着函数式编程》 讲到了 ...
    99+
    2022-11-13
    JavaScript 柯里化高阶函数 JavaScript 高阶函数
  • web开发中计数排序的示例分析
    这篇文章将为大家详细讲解有关web开发中计数排序的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。计数排序计数排序是一种非基于比较的排序算法,其空间复杂度和时间复杂度均为O(n+k),其中k是整数的...
    99+
    2023-06-19
  • web开发中函数调用以及this的指向的示例分析
    这篇文章主要为大家展示了“web开发中函数调用以及this的指向的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“web开发中函数调用以及this的指向的...
    99+
    2024-04-02
  • web开发中二叉树的示例分析
    这篇文章将为大家详细讲解有关web开发中二叉树的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。0.  前言到目前为止,我们已经讲述了顺序表、链表、栈、队...
    99+
    2024-04-02
  • Spring Boot中Web综合开发示例分析
    本篇内容主要讲解“Spring Boot中Web综合开发示例分析”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“Spring Boot中Web综合开发示例分析”吧!Web 开发Spring Boo...
    99+
    2023-06-02
  • web开发中css样式代码的示例分析
    小编给大家分享一下web开发中css样式代码的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!一.文本设置  1...
    99+
    2024-04-02
  • web开发中重排与重绘的示例分析
    小编给大家分享一下web开发中重排与重绘的示例分析,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!前言浏览器下载完页面中的所有内容:HTML、JavaScript、CSS、图片——之后会解析...
    99+
    2024-04-02
  • web前端开发规范的示例分析
    小编给大家分享一下web前端开发规范的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!规范说明此为前端开发团队遵循和约定的...
    99+
    2024-04-02
  • Vue中函数化组件的示例分析
    这篇文章将为大家详细讲解有关Vue中函数化组件的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。介绍之前创建的锚点标题组件是比较简单,没有管理或者监听任何传递给他的...
    99+
    2024-04-02
  • web开发中基于匀速运动的示例分析
    这篇文章主要介绍web开发中基于匀速运动的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!javascript中,如何让一个元素(比如div)运动起来呢?设置基本的样式,一定要...
    99+
    2024-04-02
  • web开发中B/S实时通讯的示例分析
    这篇文章主要介绍了web开发中B/S实时通讯的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。B/S的实时通讯实现起来比较麻烦,因为h...
    99+
    2024-04-02
  • JavaScript中的函数柯里化怎么使用
    这篇“JavaScript中的函数柯里化怎么使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“JavaScript中的函数柯...
    99+
    2023-07-06
  • 深入了解JavaScript中的函数柯里化
    目录一、参数复用二、延迟执行三、部分应用四、函数组合JavaScript函数柯里化是一种将接受多个参数的函数转换为一系列接受单个参数的函数的技术。这种技术可以让我们更方便地创建可复用...
    99+
    2023-05-16
    JavaScript函数柯里化 JavaScript 柯里化
  • web移动开发知识点的示例分析
    小编给大家分享一下web移动开发知识点的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧! 1、生命周期调用函数 常见的...
    99+
    2024-04-02
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作