JavaScript函数柯里化详解


Posted in Javascript onApril 29, 2016

什么是柯里化

柯里化是这样的一个转换过程,把接受多个参数的函数变换成接受一个单一参数(译注:最初函数的第一个参数)的函数,如果其他的参数是必要的,返回接受余下的参数且返回结果的新函数。

柯理化函数思想:一个js预先处理的思想;利用函数执行可以形成一个不销毁的作用域的原理,把需要预先处理的内容都储存在这个不销毁的作用域中,并且返回一个小函数,以后我们执行的都是小函数,在小函数中把之前预先存储的值进行相关的操作处理即可;

柯里化函数主要起到预处理的作用;

bind方法的作用:把传递进来的callback回调方法中的this预先处理为上下文context;

bind方法实现原理1代码如下所示:

/**
* bind方法实现原理1
* @param callback [Function] 回调函数
* @param context [Object] 上下文
* @returns {Function} 改变this指向的函数
*/
function bind(callback,context) {
var outerArg = Array.prototype.slice.call(arguments,2);// 表示取当前作用域中传的参数中除了fn,context以外后面的参数;
return function (){
var innerArg = Array.prototype.slice.call(arguments,0);//表示取当前作用域中所有的arguments参数;
callback.apply(context,outerArg.concat(innerArg));
}
}

下面一段代码模仿在原型链上的bind实现原理

/**
* 模仿在原型链上的bind实现原理(柯理化函数思想)
* @param context [Object] 上下文
* @returns {Function} 改变this指向的函数
*/
Function.prototype.mybind = function mybind (context) {
var _this = this;
var outArg = Array.prototype.slice.call(arguments,1);
// 兼容情况下
if('bind' in Function.prototype) {
return this.bind.apply(this,[context].concat(outArg));
}
// 不兼容情况下
return function () {
var inArg = Array.prototype.slice.call(arguments,0);
inArg.length === 0?inArg[inArg.length]=window.event:null;
var arg = outArg.concat(inArg);
_this.apply(context,arg);
}
}

函数柯里化(Currying)

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

柯里化就是预先将某些参数传入,得到一个简单的函数。但是预先传入的参数被保存在闭包中,因此会有一些奇特的特性。比如:

例:

var adder = function(num) {
return function(y) {
return num + y;
}
}
var inc = adder(1);
var dec = adder(-1);
//inc, dec现在是两个新的函数,作用是将传入的参数值(+/-)1
alert(inc(99));//100
alert(dec(101));//100
alert(adder(100)(2));//102
alert(adder(2)(100));//102

以上内容是小编给大家介绍的JavaScript函数柯里化及实现bind方法的方法,希望对大家有所帮助!

Javascript 相关文章推荐
jQuery 判断页面元素是否存在的代码
Aug 14 Javascript
js网页侧边随页面滚动广告效果实现
Apr 14 Javascript
jQuery获取iframe的document对象的方法
Oct 10 Javascript
javascript使用输出语句实现网页特效代码
Aug 06 Javascript
跟我学习javascript的浮点数精度
Nov 16 Javascript
基于easyui checkbox 的一些操作处理方法
Jul 10 Javascript
VUE2实现事件驱动弹窗示例
Oct 21 Javascript
Javascript Promise用法详解
May 10 Javascript
vue打包相关细节整理(小结)
Sep 28 Javascript
使用vue 国际化i18n 实现多实现语言切换功能
Oct 11 Javascript
jquery 遍历hash操作示例【基于ajax交互】
Oct 12 jQuery
JavaScript 浏览器对象模型BOM原理与常见用法实例分析
Dec 16 Javascript
easyui validatebox验证
Apr 29 #Javascript
浅析Bootstrap缩略图组件与警示框组件
Apr 29 #Javascript
javascript中利用柯里化函数实现bind方法
Apr 29 #Javascript
Bootstrap模态对话框的简单使用
Apr 29 #Javascript
jquery UI Datepicker时间控件的使用及问题解决
Apr 28 #Javascript
jquery弹出遮掩层效果【附实例代码】
Apr 28 #Javascript
onclick和onblur冲突问题的快速解决方法
Apr 28 #Javascript
You might like
再说下636单管机
2021/03/02 无线电
用PHP产生动态的影像图
2006/10/09 PHP
在IIS上安装PHP4.0正式版
2006/10/09 PHP
自己前几天写的无限分类类
2007/02/14 PHP
PHP实用函数分享之去除多余的0
2015/02/06 PHP
php实现模拟登陆方正教务系统抓取课表
2015/05/19 PHP
PHP实现多文件上传的方法
2015/07/08 PHP
php生成二维码
2015/08/10 PHP
php简单截取字符串代码示例
2016/10/19 PHP
详细分析PHP 命名空间(namespace)
2020/06/30 PHP
Javascript 作用域使用说明
2009/08/13 Javascript
动感效果的TAB选项卡jquery 插件
2011/07/09 Javascript
JQuery入门—JQuery程序的代码风格详细介绍
2013/01/03 Javascript
jquery实现的图片点击滚动效果
2014/04/29 Javascript
JQuery右键菜单插件ContextMenu使用指南
2014/12/19 Javascript
微信小程序实战之自定义抽屉菜单(7)
2017/04/18 Javascript
JavaScript实现焦点进入文本框内关闭输入法的核心代码
2017/09/20 Javascript
微信小程序中添加客服按钮contact-button功能
2018/04/27 Javascript
微信小程序实现分享商品海报功能
2019/09/30 Javascript
JavaScript类的继承多种实现方法
2020/05/30 Javascript
微信小程序实现导航栏和内容上下联动功能代码
2020/06/29 Javascript
基于javascript的无缝滚动动画实现2
2020/08/07 Javascript
[03:55]2014DOTA2国际邀请赛 Fnatic经理采访赢DK在情理之中
2014/07/10 DOTA
Python 40行代码实现人脸识别功能
2017/04/02 Python
Python列表(List)知识点总结
2019/02/18 Python
10款最好的Python开发编辑器
2019/07/03 Python
简单了解Python变量作用域正确使用方法
2020/06/12 Python
详解python的super()的作用和原理
2020/10/29 Python
python 制作网站筛选工具(附源码)
2021/01/21 Python
介绍一下Ruby中的对象,属性和方法
2012/07/11 面试题
高分子材料个人求职信范文
2013/09/25 职场文书
小学生感恩老师演讲稿
2014/08/28 职场文书
区政府领导班子个人对照检查材料
2014/09/25 职场文书
2015年乡镇流动人口工作总结
2015/05/12 职场文书
Python快速实现一键抠图功能的全过程
2021/06/29 Python
win11无法添加打印机怎么办? 提示windows无法打开添加打印机的解决办法
2022/04/05 数码科技