浅谈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 相关文章推荐
javascript通过navigator.userAgent识别各种浏览器
Oct 25 Javascript
JS获取url链接字符串 location.href
Dec 23 Javascript
jQuery实现在列表的首行添加数据
May 19 Javascript
javascript中setTimeout使用指南
Jul 26 Javascript
AngularJS教程之简单应用程序示例
Aug 16 Javascript
浅谈bootstrap使用中的一些问题以及解决过程
Oct 18 Javascript
javascript设置文本框光标的方法实例小结
Nov 04 Javascript
纯原生js实现贪吃蛇游戏
Apr 16 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
Oct 30 Javascript
5个你不知道的JavaScript字符串处理库(小结)
Jun 01 Javascript
原生JavaScript实现随机点名表
Jan 14 Javascript
面试中canvas绘制图片模糊图片问题处理
Mar 13 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
PHP读取MySQL数据代码
2008/06/05 PHP
匹配csdn用户数据库与官方用户的重合度并将重叠部分的用户筛选出来
2011/12/25 PHP
textarea中的手动换行处理的jquery代码
2011/02/26 Javascript
js动态在form上插入enctype=multipart/form-data的问题
2012/05/24 Javascript
jQuery插件 selectToSelect使用方法
2013/10/02 Javascript
使用GruntJS构建Web程序之构建篇
2014/06/04 Javascript
JavaScript中双叹号!!作用示例介绍
2014/09/21 Javascript
jquery中EasyUI实现同步树
2015/03/01 Javascript
JavaScript中的boolean布尔值使用学习及相关技巧讲解
2016/05/26 Javascript
jQuery实现的简单百分比进度条效果示例
2016/08/01 Javascript
Bootstrap和Java分页实例第二篇
2016/12/23 Javascript
jQuery实现对象转为url参数的方法
2017/01/11 Javascript
在vue中使用echarts图表实例代码详解
2018/10/22 Javascript
JavaScript寄生组合式继承原理与用法分析
2019/01/11 Javascript
vue scroll滚动判断的实现(是否滚动到底部、滚动方向、滚动节流、获取滚动区域dom元素)
2020/06/11 Javascript
快速解决vue2+vue-cli3项目ie兼容的问题
2020/11/17 Vue.js
[27:28]Ti4 冒泡赛第二天 iG vs NEWBEE 1
2014/07/15 DOTA
[02:33]2018DOTA2亚洲邀请赛赛前采访——LGD
2018/04/04 DOTA
python实现计算倒数的方法
2015/07/11 Python
python的re正则表达式实例代码
2018/01/24 Python
Numpy中的mask的使用
2018/07/21 Python
香港永安旅游网:Wing On Travel
2017/04/10 全球购物
新西兰航空中国官网:Air New Zealand China
2018/07/24 全球购物
接口的多继承会带来哪些问题
2015/08/17 面试题
大学生职业生涯规划书前言
2014/01/09 职场文书
上班玩游戏检讨书
2014/02/07 职场文书
商家认证委托书格式
2014/10/16 职场文书
家长通知书家长意见
2014/12/30 职场文书
公务员年度考核评语
2014/12/31 职场文书
2015年女生节活动总结
2015/02/27 职场文书
余世维讲座观后感
2015/06/11 职场文书
答谢酒会主持词
2015/07/02 职场文书
公司回复函格式
2015/07/14 职场文书
企业反腐倡廉心得体会
2015/08/15 职场文书
mysql对于模糊查询like的一些汇总
2021/05/09 MySQL
logback如何自定义日志存储
2021/08/30 Java/Android