JS中call,apply,bind的区别

时间:2023-03-09 00:58:58
JS中call,apply,bind的区别

1.关于this对象的指向,请看如下代码

var name = 'jack';
var age = 18;
var obj = {
name:'mary',
objAge:this.age,
myFun:function(){
console.log(this.name,this.objAge,this.age)//当前this对象指向obj故this.age是undefined
}
}
输出
JS中call,apply,bind的区别
var windowName = 'myWindow';
var obj2 = {
name:'tom',
age:22,
}
var show = function(){
console.log(this.obj2.name,this.obj2.age,this.windowname)//当前this对象指向window对象
}

输出
JS中call,apply,bind的区别

2.那如何改变方法调用时的this指向呢,其实call()、apply()、bind() 就是用来重定义 this 这个对象的!请看代码

var name = '老王',age=30;
var obj = {
name:'小张',
objAge:this.age,
myFun:function(){
console.log(this.name,this.age);
}
}
var otherObj = {
name:'张三',
age:33
}

输出

JS中call,apply,bind的区别JS中call,apply,bind的区别 JS中call,apply,bind的区别

myFun的this对象指向的是otherObj.不同的是bind返回的是一个函数需要手动执行

3.call 、bind 、 apply 如何进行传参呢又有什么区别呢

var name = '老王',age=30;
var obj = {
name:'小张',
objAge:this.age,
myFun:function(param1,param2){
console.log(this.name,this.age,param1,param2);
}
}
var otherObj = {
name:'张三',
age:33
}

输出

JS中call,apply,bind的区别

call的参数用逗号隔开可以传任意多个参数,apply的参数是一个数组,bind的参数也是用逗号隔开

当然,三者的参数不限定是 string 类型,允许是各种类型,包括函数 、 object 等等!

4.call 、bind 、 apply 常用形式

  

//例如求最大最小值,this对象用不到故可以传任意对象
Math.max.apply(undefined,[1,2,3,4])
Math.max.call(undefined,1,2,3,4,5)
Math.max.bind(undefined,1,3,5,7,9)()

JS中call,apply,bind的区别