浅谈JS中的bind方法与函数柯里化


Posted in Javascript onAugust 10, 2016

绑定函数bind()最简单的用法是创建一个函数,使这个函数不论怎么调用都有同样的this值。不同于call和apply只是单纯地设置this的值后传参,它还会将所有传入bind()方法中的实参(第一个参数之后的参数)与this一起绑定。

关于这个特性看《JS权威指南》原文的例子:

var sum = function(x,y) { return x + y }; 

var succ = sum.bind(null, 1); //让this指向null,其后的实参也会作为实参传入被绑定的函数sum

succ(2); // => 3: 可以看到1绑定到了sum函数中的x

其次, bind()方法所返回的函数的length(形参数量)等于原函数的形参数量减去传入bind()方法中的实参数量(第一个参数以后的所有参数),因为传入bind中的实参都会绑定到原函数的形参,举个例子:

function func(a,b,c,d){...} //func的length为4

var after = func.bind(null,1,2); //这里输入了两个实参(1,2)绑定到了func函数的a,b

console.log(after.length); //after的length为2

第三,当bind()所返回的函数用作构造函数的时候, 传入bind()的this将被忽略,实参会全部传入原函数,这样说很抽象,举个例子:

function original(x){
 this.a = 1;
 this.b = function(){return this.a + x}
}
var obj={
 a = 10
}
var newObj = new(original.bind(obj, 2)); //传入了一个实参2

console.log(newObj.a); //输出1, 说明返回的函数用作构造函数时obj(this的值)被忽略了
console.log(newObj.b()); //输出3 ,说明传入的实参2传入了原函数original

以上就是ES5中bind方法的特性, 这种技术也被称为函数柯里化。这种技术将多个参数的函数变成只带一个参数的函数。bind方法就是该技术在js中的实践。

关于这篇浅谈JS中的bind方法与函数柯里化就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
无闪烁更新网页内容JS实现
Dec 19 Javascript
jQuery实现复选框全选/取消全选/反选及获得选择的值
Jun 12 Javascript
浅谈JavaScript数据类型
Mar 03 Javascript
javascript无刷新评论实现方法
May 13 Javascript
jquery-tips悬浮提示插件分享
Jul 31 Javascript
BootstrapValidator超详细教程(推荐)
Dec 07 Javascript
javascript设计模式之单体模式学习笔记
Feb 15 Javascript
JavaScript实现打地鼠小游戏
Apr 23 Javascript
Bootstrap Table 删除和批量删除
Sep 22 Javascript
如何选择适合你的JavaScript框架
Nov 20 Javascript
JavaScript函数重载操作实例浅析
May 02 Javascript
vue 解决addRoutes多次添加路由重复的操作
Aug 04 Javascript
封装的dialog插件 基于bootstrap模态对话框的简单扩展
Aug 10 #Javascript
JS控制静态页面传递参数并获取参数应用
Aug 10 #Javascript
基于JavaScript实现树形下拉框
Aug 10 #Javascript
关于原生js中bind函数的简单实现
Aug 10 #Javascript
Mvc提交表单的四种方法全程详解
Aug 10 #Javascript
mvc中form表单提交的三种方式(推荐)
Aug 10 #Javascript
浅谈JS运算符&&和|| 及其优先级
Aug 10 #Javascript
You might like
电脑硬件及电脑配置知识大全
2020/03/17 数码科技
PHP MemCached 高级缓存应用代码
2010/08/05 PHP
WordPress中给文章添加自定义字段及后台编辑功能区域
2015/12/19 PHP
Thinkphp5.0框架的Db操作实例分析【连接、增删改查、链式操作等】
2019/10/11 PHP
laravel框架 laravel-admin上传图片到oss的方法
2019/10/13 PHP
javascript parseInt与Number函数的区别
2010/01/21 Javascript
Javascript 类与静态类的实现(续)
2010/04/02 Javascript
JavaScript 设计模式之组合模式解析
2010/04/09 Javascript
基于jQuery实现表格数据的动态添加与统计的代码
2011/01/31 Javascript
javascript中声明函数的方法及调用函数的返回值
2014/07/22 Javascript
js根据鼠标移动速度背景图片自动旋转的方法
2015/02/28 Javascript
jquery ztree异步搜索(搜叶子)实践
2016/02/25 Javascript
Bootstrap学习笔记之css样式设计(1)
2016/06/07 Javascript
layer弹出层中H5播放器全屏出错的解决方法
2017/02/21 Javascript
Vue.js实现文章评论和回复评论功能
2020/05/30 Javascript
vue表单绑定实现多选框和下拉列表的实例
2017/08/12 Javascript
bootstrap datetimepicker控件位置异常的解决方法
2017/11/23 Javascript
vue+iview 实现可编辑表格的示例代码
2018/10/31 Javascript
详解Node.js 中使用 ECDSA 签名遇到的坑
2018/11/26 Javascript
Python实现批量把SVG格式转成png、pdf格式的代码分享
2014/08/21 Python
通过源码分析Python中的切片赋值
2017/05/08 Python
python实现redis三种cas事务操作
2017/12/19 Python
python将.ppm格式图片转换成.jpg格式文件的方法
2018/10/27 Python
python实现维吉尼亚算法
2019/03/20 Python
python pandas写入excel文件的方法示例
2019/06/25 Python
Python绘制频率分布直方图的示例
2019/07/08 Python
解决python父线程关闭后子线程不关闭问题
2020/04/25 Python
美国正宗设计师眼镜在线零售商:EYEZZ
2019/03/23 全球购物
2016大一新生入学教育心得体会
2016/01/23 职场文书
某药房的新员工入职告知书!
2019/07/15 职场文书
python 解决微分方程的操作(数值解法)
2021/05/26 Python
python基础之文件操作
2021/10/24 Python
前端实现滑动按钮AJAX与后端交互的示例代码
2022/02/24 Javascript
详解使用内网穿透工具Ngrok代理本地服务
2022/03/31 Servers
《现实主义勇者的王国再建记》第三弹OST全曲试听片段公开
2022/04/04 日漫
Python 使用 Frame tkraise() 方法在 Tkinter 应用程序中的Frame之间切换
2022/04/24 Python