浅谈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 相关文章推荐
extjs 列表框(multiselect)的动态添加列表项的方法
Jul 31 Javascript
JS实现鼠标经过好友列表中的好友头像时显示资料卡的效果
Jul 02 Javascript
DOM节点深度克隆函数cloneNode()用法实例
Jan 12 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
Oct 30 Javascript
Bootstrap Search Suggest使用例子
Dec 21 Javascript
Omi v1.0.2发布正式支持传递javascript表达式
Mar 21 Javascript
详解Vue用自定义指令完成一个下拉菜单(select组件)
Oct 31 Javascript
详解Webpack多环境代码打包的方法
Aug 03 Javascript
vue监听input标签的value值方法
Aug 27 Javascript
vue如何限制只能输入正负数及小数
Jul 04 Javascript
使用Node.js实现base64和png文件相互转换的方法
Mar 11 Javascript
antd-日历组件,前后禁止选择,只能选中间一部分的实例
Oct 29 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
Mysql的Root密码忘记,查看或修改的解决方法(图文介绍)
2013/06/14 PHP
php常用字符串比较函数实例汇总
2014/11/24 PHP
PHP中addslashes与mysql_escape_string的区别分析
2016/04/25 PHP
PHP获取当前文件的父目录方法汇总
2016/07/21 PHP
PHP基于PDO调用sqlserver存储过程通用方法【基于Yii框架】
2017/10/07 PHP
Laravel框架自定义验证过程实例分析
2019/02/01 PHP
从零开始学习jQuery (十一) 实战表单验证与自动完成提示插件
2011/02/23 Javascript
js编码之encodeURIComponent使用介绍(asp,php)
2012/03/01 Javascript
JSONP跨域的原理解析及其实现介绍
2014/03/22 Javascript
jQuery ajax调用WCF服务实例
2014/07/16 Javascript
JavaScript onkeypress事件入门实例(按下或按住一个键盘按键)
2014/10/17 Javascript
JS动态修改图片的URL(src)的方法
2015/04/01 Javascript
JavaScript时间转换处理函数
2015/04/14 Javascript
整理JavaScript创建对象的八种方法
2015/11/03 Javascript
常用的Javascript设计模式小结
2015/12/09 Javascript
微信小程序 表单Form实例详解(附源码)
2016/12/22 Javascript
jQuery快速高效制作网页交互特效
2017/02/24 Javascript
基于vuejs实现一个todolist项目
2017/04/11 Javascript
JavaScript表单验证实现代码
2017/05/22 Javascript
微信小程序中换行空格(多个空格)写法详解
2018/07/10 Javascript
vue-video-player 解决微信自动全屏播放问题(横竖屏导致样式错乱问题)
2020/02/25 Javascript
vue的hash值原理也是table切换实例代码
2020/12/14 Vue.js
python 处理string到hex脚本的方法
2018/10/26 Python
Opencv求取连通区域重心实例
2020/06/04 Python
详解anaconda离线安装pytorchGPU版
2020/09/08 Python
Canvas 文字碰撞检测并抽稀的方法
2019/05/27 HTML / CSS
有原因的手表:Flex Watches
2019/03/23 全球购物
如何进行Linux分区优化
2016/09/13 面试题
农民入党思想汇报
2014/01/03 职场文书
临床医师专业个人自我评价
2014/01/08 职场文书
护士辞职信模板
2014/01/20 职场文书
关于爱国的演讲稿
2014/05/07 职场文书
停电调休通知
2015/04/16 职场文书
2015年招商引资工作总结
2015/04/25 职场文书
2015年重阳节活动主持词
2015/07/30 职场文书
2016七一建党节慰问信
2015/11/30 职场文书