JavaScript函数柯里化实现原理及过程


Posted in Javascript onDecember 02, 2020

简介
当我们在读Vue源码到时候会发现,在它的 _update 实例中就用到了函数柯里化,(createPatchFunction方法)有兴趣的可以

去看一下。

柯里化(Currying)是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数而且返回结果的新函数的技术。

在《Mostly adequate guide》中,这样总结了 Currying ——只传递给函数一部分参数来调用它,让它返回一个函数去处理剩下的参数。

Currying 是函数式编程的一种实现,可以给我们的编程带来便利。那 Currying 函数到底长什么样呢?请往下看,我们根据它的概念自己来写一个柯里化函数

实现

// 如何实现 add(1,2) === add(1)(2)
let add = (...args) => {
  return args.length === 1 ? a => a + args[0] : args[0] + args[1]
}

这个似乎有一点接近柯里化的意思,但并不是真正的Currying,我们应该做到 add(1,2,3,,,) === currying(add)(1,2,3,,,) 才能算是真正的柯里化函数,OK,我们继续往下来,

let add = (...args) => args.reduce((a,b)=>a+b)
 
let currying = (fn)=>{
  return function(...args){
    return fn.apply(this, args)
  }
}
// add(1,2,3,,,) === currying(add)(1,2,3,,,)

还有人这么玩,可以参考下

let currying = (fn) => {
  var args = [].slice.call(arguments, 1)
  return function() {
    var newArgs = args.concat([].slice.call(arguments))
    return fn.apply(this, newArgs)
  }
}
 
let addCurry = currying(add, 1, 2);
addCurry() // 3
 
addCurry = currying(add, 1);
addCurry(2) // 3
 
addCurry = currying(add);
addCurry(1, 2) // 3

实际上这个实现方法利用闭包的原理,有时间给大家做个对比,

分析

可以看到,实际上柯里化函数并不算难,要想实际运用在我们的开发中,需要我们花点小心思~

参考:https://github.com/FIGHTING-TOP/FE-knowlodge-base/issues/4

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
cloudgamer出品ImageZoom 图片放大效果
Apr 01 Javascript
jquery操作checkbox示例分享
Jul 21 Javascript
Js数组排序函数sort()介绍
Jun 08 Javascript
jQuery插件开发汇总
May 15 Javascript
浅谈JavaScript的push(),pop(),concat()方法
Jun 03 Javascript
微信小程序 火车票查询实例讲解
Oct 17 Javascript
微信小程序 简单教程实例详解
Jan 13 Javascript
微信JS-SDK选取手机照片上传功能
Apr 21 Javascript
jsonp跨域获取百度联想词的方法分析
May 13 Javascript
js图数据结构处理 迪杰斯特拉算法代码实例
Sep 11 Javascript
优雅的使用javascript递归画一棵结构树示例代码
Sep 22 Javascript
微信小程序中的上拉、下拉菜单功能
Mar 13 Javascript
element-ui中el-upload多文件一次性上传的实现
Dec 02 #Javascript
element-plus一个vue3.xUI框架(element-ui的3.x 版初体验)
Dec 02 #Vue.js
keep-alive保持组件状态的方法
Dec 02 #Javascript
vue组件中节流函数的失效的原因和解决方法
Dec 02 #Vue.js
Vue3+elementui plus创建项目的方法
Dec 01 #Vue.js
JS实现超级好看的鼠标小尾巴特效
Dec 01 #Javascript
echarts饼图各个板块之间的空隙如何实现
Dec 01 #Javascript
You might like
PHP面向对象编程快速入门
2006/10/09 PHP
php radio 单选框获取与保持值的实现代码
2010/05/15 PHP
php 不使用js实现页面跳转
2014/02/11 PHP
深入理解PHP中的empty和isset函数
2016/05/26 PHP
超强多功能php绿色集成环境详解
2017/01/25 PHP
PHP实现的mysql主从数据库状态检测功能示例
2017/07/20 PHP
jquery中get,post和ajax方法的使用小结
2014/02/04 Javascript
ExtJS中设置下拉列表框不可编辑的方法
2014/05/07 Javascript
js实现C#的StringBuilder效果完整实例
2015/12/22 Javascript
jQuery EasyUI之DataGrid使用实例详解
2016/01/04 Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
2016/06/12 Javascript
详解Javascript函数声明与递归调用
2016/10/22 Javascript
Extjs让combobox写起来简洁又漂亮
2017/01/05 Javascript
React Native中NavigatorIOS组件的简单使用详解
2018/01/27 Javascript
javascript、php关键字搜索函数的使用方法
2018/05/29 Javascript
vue实现在线翻译功能
2019/09/27 Javascript
python用10行代码实现对黄色图片的检测功能
2015/08/10 Python
python装饰器实例大详解
2017/10/25 Python
Python DataFrame设置/更改列表字段/元素类型的方法
2018/06/09 Python
Python使用itertools模块实现排列组合功能示例
2018/07/02 Python
基于python实现名片管理系统
2018/11/30 Python
20行python代码实现人脸识别
2019/05/05 Python
Python字符串大小写转换拼接删除空白
2019/09/19 Python
解决python ThreadPoolExecutor 线程池中的异常捕获问题
2020/04/08 Python
使用OpenCV实现道路车辆计数的使用方法
2020/07/15 Python
Python文件操作的面试题
2013/06/22 面试题
仪器仪表检测毕业生自荐信
2013/10/31 职场文书
劳资员岗位职责
2013/11/11 职场文书
财务管理专业自荐信范文
2013/12/24 职场文书
职工运动会邀请函
2014/02/02 职场文书
跟单业务员岗位职责
2014/03/08 职场文书
大专护理专业自荐信
2015/03/25 职场文书
2015大学生入党个人自传
2015/06/26 职场文书
Go语言使用select{}阻塞main函数介绍
2021/04/25 Golang
goland设置颜色和字体的操作
2021/05/05 Golang
欧元符号 €
2022/02/17 杂记