call、apply和bind是Function对象自带的三个方法,都是为了改变函数体内部 this 的指向。
apply 、 call 、bind 三者第一个参数都是 this 要指向的对象,也就是想指定的上下文;
apply 、 call 、bind 三者都可以利用后续参数传参;
bind 是返回对应 函数,便于稍后调用;apply 、call 则是立即调用 。
function fruits() {}
fruits.prototype = {
color: 'red',
say: function() {
console.log(this.color);
}
};
var apple = new fruits();
apple.say(); // red, 此时方法里面的this 指的是fruits
banana = {color: 'yellow'};
apple.say.call(banana); //yellow,此时的this的指向已经通过call()方法改变了,指向的是banana,this.color就是banana.color='yellow';
apple.say.apply(banana);//yellow,同理,此时的this的指向已经通过apply()方法改变了,指向的是banana,this.color就是banana.color ='yellow';
apple.say.apply(null); //undefined, null是window下的,此时,this 就指向了window ,但是window下并没有clolr这个属性,因此this.clolr就是window.color=undefined;
call 传入参数列表
apply 传入数组
var array1 = [12,'foo'];
var array2 = ['Doe',100];
Array.prototype.push.call(array1, 'Doe',100)
Array.prototype.push.apply(array1, array2)
bind() 方法会创建一个 新函数,当调用这个新函数时,新函数会以创建它时传入 bind() 方法的第一个参数 作为 this,传入 bind() 方法的 第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。
var bar = function(){
console.log(this.x);
};
var foo = {
x:3
};
bar(); // undefined
var func = bar.bind(foo);
func(); // 3