浅谈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特权方法定义作用以及与公有方法的区别
Mar 18 Javascript
jQuery(js)获取文字宽度(显示长度)示例代码
Dec 31 Javascript
JS弹出层单纯的绝对定位居中示例代码
Feb 18 Javascript
JavaScript中Date.toSource()方法的使用教程
Jun 12 Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
Jun 01 Javascript
angular.js 路由及页面传参示例
Feb 24 Javascript
微信小程序 动态绑定数据及动态事件处理
Mar 14 Javascript
JQueryMiniUI按照时间进行查询的实现方法
Jun 07 jQuery
JS+HTML5 FileReader实现文件上传前本地预览功能
Mar 27 Javascript
三种Webpack打包方式(小结)
Sep 19 Javascript
后台使用freeMarker和前端使用vue的方法及遇到的问题
Jun 13 Javascript
Vue中登录验证成功后保存token,并每次请求携带并验证token操作
Sep 08 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判断指定时间段的2个方法
2014/03/14 PHP
浅谈ThinkPHP5.0版本和ThinkPHP3.2版本的区别
2017/06/17 PHP
js 编写规范
2010/03/03 Javascript
js以对象为索引的关联数组
2010/07/04 Javascript
StringTemplate遇见jQuery冲突的解决方法
2011/09/22 Javascript
鼠标拖动实现DIV排序示例代码
2013/10/14 Javascript
jquery改变disabled的boolean状态的三种方法
2013/12/13 Javascript
javascript操作cookie
2017/01/17 Javascript
SVG描边动画
2017/02/23 Javascript
Angular 4依赖注入学习教程之简介(一)
2017/06/04 Javascript
fetch 使用及如何接收JS传值
2017/11/11 Javascript
使用vue制作探探滑动堆叠组件的实例代码
2018/03/07 Javascript
vue实现学生录入系统之添加删除功能
2018/07/11 Javascript
JS大坑之19位数的Number型精度丢失问题详解
2019/04/22 Javascript
深入了解Hybrid App技术的相关知识
2019/07/17 Javascript
element跨分页操作选择详解
2020/06/29 Javascript
vue.js click点击事件获取当前元素对象的操作
2020/08/07 Javascript
vue 在服务器端直接修改请求的接口地址
2020/12/19 Vue.js
python中执行shell的两种方法总结
2017/01/10 Python
Python文件的读写和异常代码示例
2017/10/31 Python
Django使用Mysql数据库已经存在的数据表方法
2018/05/27 Python
python装饰器三种装饰模式的简单分析
2020/09/04 Python
如何用Django处理gzip数据流
2021/01/29 Python
python FTP编程基础入门
2021/02/27 Python
H5页面适配iPhoneX(就是那么简单)
2019/12/02 HTML / CSS
碧欧泉美国官网:Biotherm美国
2016/08/31 全球购物
Lookfantastic葡萄牙官方网站:欧洲第一大化妆品零售商
2018/03/17 全球购物
新西兰杂志订阅:isubscribe
2019/08/26 全球购物
2014党支部对照检查材料思想汇报
2014/10/05 职场文书
公司离职证明标准范本
2014/10/05 职场文书
工作批评与自我批评范文
2014/10/16 职场文书
公司财务人员岗位职责
2015/04/14 职场文书
二审答辩状范文
2015/05/22 职场文书
联谊会开场白
2015/06/01 职场文书
2015质检员个人年终工作总结
2015/10/23 职场文书
Java面试题冲刺第十六天--消息队列
2021/08/07 面试题