一、共同点
都能改变函数的执行的上下文,就是函数里this指向的对象
1、 call ,apply,bind
call和apply都是用来调用函数的,例如:
var isOn=true;
var lightBulb={
toggle:function(){
console.log(this.isOn);
return this.isOn;
},
isOn:false
}
lightbulb.toggle.call();然后这里为什么要用call来调用来多此一举呢,因为call和apply能改变this的指向,就是能动态决定this指向问题。
toggle=lightBulb.toggle;
toggle (); //输出true ,this指向的是window
lightBulb.toggle();//输出false, this指向的是lightBulb
如果要改变第一种调用的方式下this的指向,仍然指向lightBulb;可以利用call和apply来改变this的指向,像下面这样调用:
toggle=lightBulb.toggle;
toggle .call(lightBulb); //输出false
toggle .apply (lightBulb) //输出false
然而用来改变函数执行的上下文,bind同样可以做到,例如:
toggle=lightBulb.toggle;
toggle .bind(lightBulb)(); //输出false
2、 call,apply的差异
当然call和apply也是不一样的,这个通常书本上都会介绍,它们在后面参数化形式不一样,具体调用如下例子:
varcountry='American';
var person={
toggle:function(name,sex){
this.name=name;
this.sex=sex;
return[this.name,this.sex,this.country]
},
name:'jack',
sex:'male',
country:'China'
} vartoggle=person.toggle;
var woman1=toggle.call(person,'rose','female');
var arguments=['kate','female'];
var woman2= toggle.apply(person,arguments);
console.log(woman1); //["rose", "female","China"]
console.log(woman2); //["kate", "female","China"]
二、不同点
1、 call和apply所绑定的this上下文指向是临时的,每次调用都要注意,而bind是将函数的this指向与目标对象绑定,返回的是个绑定this上下文的函数,比较稳定。
2、 call和apply是绑定之后立马执行该函数,bind只是绑定目标对象并不执行。
Bind是es5里面的方法,有些浏览器是不支持的。例如ie6,7,8;因此可以自己实现这个函数
Function.prototype.bind=function(context){
varself=this;
returnfunction(args){
returnself.apply(context,arguments);
}
}