浅谈js中的bind


Posted in Javascript onMarch 18, 2019

提到bind方法,估计大家还会想到call方法、apply方法;它们都是Function对象内建的方法,它们的第一个参数都是用来更改调用方法中this的指向。需要注意的是bind 是返回新的函数,以便稍后调用;apply 、call 则是立即调用原函数 。而今天我们主要讲解bind方法的理解与使用。

bind方法是EcmaScript5新增的方法,该方法在mdn上是这么介绍的:

bind()方法创建一个新的函数(称为绑定函数), 当被调用时,将其this关键字设置为提供的值,在调用新函数时,在任何提供之前提供一个给定的参数序列。

语法:

fun.bind(thisArg[, arg1[, arg2[, …]]])

参数thisArg表示:当绑定函数被调用时,该参数会作为this的指向。当使用new 操作符调用绑定函数时,该参数无效。
参数arg1, arg2, …表示:当绑定函数被调用时,这些参数将置于实参之前传递给被绑定的方法。
先来看个例子:

this.name="jack";
var demo={
name:"rose",
getName:function(){return this.name;}
}

console.log(demo.getName());//输出rose 这里的this指向demo

var another=demo.getName;
console.log(another())//输出jack 这里的this指向全局对象
 
//运用bind方法更改this指向
var another2=another.bind(demo);
console.log(another2());//输出rose 这里this指向了demo对象了

bind的应用

可以对一个函数预设初始参数:

function a(){
return Array.prototype.slice.call(arguments);//将类数组转换成真正的数组
}
var b=a.bind(this,15,20)
alert(b());//弹出 15,20
var s=b(25,30);
alert(s);//弹出 15,20,25,30

js bind的多次绑定只有第一次是有效的

var getname = function(){console.log(this.name)};
var m = getname.bind({name:'q1'}).bind({name:'q2'});
m();

输出的是q1

以上所述是小编给大家介绍的js中的bind详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持! 

Javascript 相关文章推荐
JavaScript使用prototype定义对象类型(转)[
Dec 22 Javascript
JS写的数字拼图小游戏代码[学习参考]
Oct 29 Javascript
jquery实现带单选按钮的表格行选中时高亮显示
Aug 01 Javascript
检查输入的是否是数字使用keyCode配合onkeypress事件
Jan 23 Javascript
node.js使用require()函数加载模块
Nov 26 Javascript
Js中使用hasOwnProperty方法检索ajax响应对象的例子
Dec 08 Javascript
JavaScript自定义等待wait函数实例分析
Mar 23 Javascript
Bootstrap整体框架之JavaScript插件架构
Dec 15 Javascript
JavaScript优化以及前段开发小技巧
Feb 02 Javascript
浅谈Vue.use的使用
Aug 29 Javascript
js中Generator函数的深入讲解
Apr 07 Javascript
如何配置vue.config.js 处理static文件夹下的静态文件
Jun 19 Javascript
node微信开发之获取access_token+自定义菜单
Mar 17 #Javascript
JavaScript中this用法学习笔记
Mar 17 #Javascript
通过JavaScript下载文件到本地的方法(单文件)
Mar 17 #Javascript
微信小程序登录session的使用
Mar 17 #Javascript
Javascript读写cookie的实例源码
Mar 16 #Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
Mar 16 #Javascript
vue自定义指令用法经典实例小结
Mar 16 #Javascript
You might like
PHP附件下载中文名称乱码的解决方法
2015/12/17 PHP
利用PHP自动生成印有用户信息的名片
2016/08/01 PHP
犀利的js 函数集合
2009/06/11 Javascript
Prototype Array对象 学习
2009/07/19 Javascript
function foo的原型与prototype属性解惑
2010/11/19 Javascript
jquery+css实现的红色线条横向二级菜单效果
2015/08/22 Javascript
基于javascript实现tab选项卡切换特效调试笔记
2016/03/30 Javascript
Javascript必知必会(四)js类型转换
2016/06/08 Javascript
angularjs中使用ng-bind-html和ng-include的实例
2017/04/28 Javascript
Bootstrap table使用方法总结
2017/05/10 Javascript
Vue.js实现价格计算器功能
2020/03/30 Javascript
AngularJS实现动态切换样式的方法分析
2018/06/26 Javascript
浅析Vue.js中v-bind v-model的使用和区别
2018/12/04 Javascript
使用axios请求接口,几种content-type的区别详解
2019/10/29 Javascript
微信小程序request请求封装,验签代码实例
2019/12/04 Javascript
[03:00]DOTA2-DPC中国联赛1月18日Recap集锦
2021/03/11 DOTA
Python的Flask框架中集成CKeditor富文本编辑器的教程
2016/06/13 Python
python爬取亚马逊书籍信息代码分享
2017/12/09 Python
Python下载网络小说实例代码
2018/02/03 Python
Python 查找list中的某个元素的所有的下标方法
2018/06/27 Python
浅析python参数的知识点
2018/12/10 Python
Django 内置权限扩展案例详解
2019/03/04 Python
深入解析Python小白学习【操作列表】
2019/03/23 Python
Python redis操作实例分析【连接、管道、发布和订阅等】
2019/05/16 Python
django rest framework使用django-filter用法
2020/07/15 Python
Hush Puppies澳大利亚官网:舒适的男女休闲和正装鞋
2019/08/24 全球购物
信息管理员岗位职责
2013/12/01 职场文书
高中学生评语大全
2014/04/25 职场文书
医院安全生产月活动总结
2014/07/05 职场文书
小学生关于梦想的演讲稿
2014/08/22 职场文书
敬老月活动总结
2014/08/28 职场文书
浪漫婚礼主题活动策划方案
2014/09/15 职场文书
群众路线剖析材料
2014/09/30 职场文书
师德承诺书
2015/01/20 职场文书
投标承诺函范文
2015/01/21 职场文书
golang使用map实现去除重复数组
2022/04/14 Golang