一、概括
1.相同点:
1)都是用于改变函数内的this指向。
2)首个参数都是改变后this指向的对象(或函数)。
2.不同点:
1)call、apply调用后会在改变this指向后立即执行一次,而bind函数执行后则会返回一个新函数,需要手动再次调用才能执行。
2)接收首个参数外的其他参数时,call和bind直接在函数中传入多个参数;apply则需要传入一个数组,数组的元素为需要传入的参数。
二、基础用法
const obj1 = {
name: "Jack",
getName: function(){
console.log(this.name);
}
};
const obj2 = {
name: "Susan"
};
obj1.getName(); // "Jack" 此时obj1.getName的this指向obj1本身,所以输出obj1.name
obj1.getName.call(obj2); // "Susan" 此时obj1.getName的this指向对象obj2,且会立即执行一次,所以输出obj2.name
obj1.getName.apply(obj2); // "Susan" 此时obj1.getName的this指向对象obj2,且会立即执行一次,所以输出obj2.name
obj1.getName.bind(obj2)(); // "Susan" 此时obj1.getName的this指向对象obj2,会返回一个新的函数,需要手动调用才能执行,输出obj2.name
三、传参方法
const obj1 = {
name: "Jack",
getInfo: function(sex,age){
console.log(`我叫${this.name},性别${sex},今年${age}岁`);
}
};
const obj2 = {
name: "Susan"
};
obj1.getInfo("女",18); // "我叫Jack,性别女,今年18岁"
obj1.getInfo.call(obj2,"女",18); // "我叫Susan,性别女,今年18岁"
obj1.getInfo.apply(obj2,["女",18]); // "我叫Susan,性别女,今年18岁"
obj1.getInfo.bind(obj2,"女",18)(); // "我叫Susan,性别女,今年18岁"
四、总结
call和apply方法调用后会立即执行一次,bind方法调用后需要手动执行;apply方法传参需以数组形式传入。