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 相关文章推荐
JavaScript判断DOM何时加载完毕的技巧
Nov 11 Javascript
jquery实现输入框动态增减的实例代码
Jul 14 Javascript
jquery实现网页查找功能示例分享
Feb 12 Javascript
再JavaScript的jQuery库中编写动画效果的指南
Aug 13 Javascript
js实现的鼠标滚轮滚动切换页面效果(类似360默认页面滚动切换效果)
Jan 27 Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
Jun 17 Javascript
Vue中父子组件通讯之todolist组件功能开发
May 21 Javascript
vue中各选项及钩子函数执行顺序详解
Aug 25 Javascript
移动端自适应flexible.js的使用方法(不用三大框架,仅写一个单html页面使用)推荐
Apr 02 Javascript
JavaScript+HTML5 canvas实现放大镜效果完整示例
May 15 Javascript
vue如何在项目中调用腾讯云的滑动验证码
Jul 15 Javascript
vue 实现tab切换保持数据状态
Jul 21 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
我的论坛源代码(九)
2006/10/09 PHP
在数据量大(超过10万)的情况下
2007/01/15 PHP
一家之言的经验之谈php+mysql扎实个人基本功
2008/03/27 PHP
利用Memcached在php下实现session机制 替换PHP的原生session支持
2010/08/21 PHP
PHP删除数组中的特定元素的代码
2012/06/28 PHP
10 个经典PHP函数
2013/10/17 PHP
php 启动时报错的简单解决方法
2014/01/27 PHP
ThinkPHP实现递归无级分类――代码少
2015/07/29 PHP
php轻量级的性能分析工具xhprof的安装使用
2015/08/12 PHP
php foreach如何跳出两层循环(详解)
2016/11/05 PHP
ThinkPHP框架整合微信支付之刷卡模式图文详解
2019/04/10 PHP
jquery 多级下拉菜单核心代码
2010/05/21 Javascript
nodejs中exports与module.exports的区别详细介绍
2013/01/14 NodeJs
浅谈JavaScript 浏览器对象
2016/06/03 Javascript
浅谈js中的in-for循环
2016/06/28 Javascript
详解jQuery中的事件
2016/12/14 Javascript
Move.js入门
2017/02/08 Javascript
Angular 如何使用第三方库的方法
2018/04/18 Javascript
在Vue中使用axios请求拦截的实现方法
2018/10/25 Javascript
Vue.js子组件向父组件通信的方法实例代码详解
2018/12/10 Javascript
Python3实现腾讯云OCR识别
2018/11/27 Python
详解python中init方法和随机数方法
2019/03/13 Python
英国最大的经认证的有机超市:Planet Organic
2018/02/02 全球购物
捷克厨房用品购物网站:Tescoma
2018/07/13 全球购物
7 For All Mankind官网:美国加州洛杉矶的高级牛仔服装品牌
2018/12/20 全球购物
彪马英国官网:PUMA英国
2019/02/11 全球购物
植村秀美国官网:Shu Uemura美国
2019/03/19 全球购物
如何唤起类中的一个方法
2013/11/29 面试题
优秀员工年终发言演讲稿
2014/01/01 职场文书
《玩具柜台前的孩子》教学反思
2014/02/13 职场文书
《猴子种果树》教学反思
2014/04/26 职场文书
品德评语大全
2014/05/05 职场文书
授权委托书怎么写
2014/09/25 职场文书
户籍证明模板
2014/09/28 职场文书
关于召开会议的通知
2015/04/15 职场文书
Go语言安装并操作redis的go-redis库
2022/04/14 Golang