[Js进阶]bind、call、apply三个方法
admin
2024-03-20 19:44:49

Js中bind、call、apply三个方法

自己几年前写的东西了,翻出来复习一下…

bind()

Function.*prototype.*bind()的使用与实现

call()

Function.*prototype.*call()的使用与实现

apply

Function.*prototype.*apply()的使用和实现

使用场景

为什么需要 call, apply, bind 来改变函数中的 this 指向呢?因为有些实例中是没有一些方法的,需要通过 call, apply, bind 来改变 this 指向当前实例,这样函数执行时就会作用到当前实例,从而达到没有该方法的实例借用该方法的效果。举个生活中的例子:我(实例A)有一个铁哥们小王(实例B),他家里有一台 PS5(工具/方法),我呢非常想玩一款 PS5 游戏,但是自己又没钱去买 PS5,于是,我就去找小王“借”(call/apply/bind)来 PS5 来玩一段时间(这段时间 PS5 归属人就是我,不再是小王),玩完后再还给他。简单地说,就是 call, apply, bind 相当于“借用”的功能。

示例:将类数组对象或者其它可迭代对象转为数组,通过使用数组的方法 slice() 实现,但对象里是没有这个方法的,所以需要通过 call/apply/bind 借用 slice()。

var obj = {0:'a',1:'b',2:'c',length:3}
var arr = Array.prototype.slice.call(obj, 0)
// Array.prototype.slice.call(obj, 0) 相当于 obj.slice(0),但 obj 属于对象类型,对象是没有该方法的,所以直接这样使用会报错,这时就得使用 call 等来借用数组的方法。
console.log(arr) // ['a','b','c']

call/apply/bind 区别

call 和 apply 都会执行函数,而 bind 不会执行,会返回改变 this 指向后的函数; call 和 bind 传参方式都一样,第一个参数都是所要指向的对象,第二个及后续参数都为要传入给函数的参数,而 apply 的传参区别在于第二个参数是数组,数组里存放的就是要传进去的参数。

总结:call/apply/bind 都是用来改变函数中的 this 指向,只不过 call 传参是个序列, apply 是个数组,call/apply都会执行函数,而 bind 不会执行,会返回改变 this 指向后的函数。call/apply/bind 可以理解就是一个能够借用他人方法的工具,充当“借”的功能。

相关内容

热门资讯

国庆黄金周景区情况:大同古城半... 文| 芙昕 编辑 | 芙昕 国庆长假,很多人都计划着出门走走,可一到了那些热门景点,看到的往往不是山...
来大东北一共分两步:先“冷藏”... 还在被“东北=冰窖”的刻板印象吓退? 南方的“小土豆”们 别急着裹紧小棉袄 这个冬天 让“气候缓冲带...
第三届“长城之约”活动在河北涞... 11月15日,第三届"长城之约"全球推广活动暨世界文化遗产对话15日在河北省保定市涞源县启幕。 本次...
巴厘岛:时光在此停驻 (自由行... 曾几何时,世人只知巴厘岛而不知印尼。巴厘岛的美太过耀眼,以至于人们常常忘记——它只是印尼万千岛屿中最...