我已经知道apply和call是类似的函数，它们设置this(函数的上下文)。
区别在于我们发送参数的方式(manual vs array)
问题:
但是什么时候应该使用bind()方法呢?
var obj = {
x: 81,
getX: function() {
return this.x;
}
};
alert(obj.getX.bind(obj)());
alert(obj.getX.call(obj));
alert(obj.getX.apply(obj));
jsbin
当前回答
call():——这里我们单独传递函数参数，而不是数组格式
var obj = {name: "Raushan"};
var greeting = function(a,b,c) {
return "Welcome "+ this.name + " to "+ a + " " + b + " in " + c;
};
console.log(greeting.call(obj, "USA", "INDIA", "ASIA"));
apply():——这里我们以数组格式传递函数参数
var obj = {name: "Raushan"};
var cal = function(a,b,c) {
return this.name +" you got " + a+b+c;
};
var arr =[1,2,3]; // array format for function arguments
console.log(cal.apply(obj, arr));
bind (): -
var obj = {name: "Raushan"};
var cal = function(a,b,c) {
return this.name +" you got " + a+b+c;
};
var calc = cal.bind(obj);
console.log(calc(2,3,4));
其他回答
Call, Apply和Bind之间的基本区别是:
如果您希望执行上下文出现在图的后面，则将使用Bind。
Ex:
var car = {
registrationNumber: "007",
brand: "Mercedes",
displayDetails: function(ownerName){
console.log(ownerName + ' this is your car ' + '' + this.registrationNumber + " " + this.brand);
}
}
car.displayDetails('Nishant'); // **Nishant this is your car 007 Mercedes**
假设我想在其他变量上使用这个方法
var car1 = car.displayDetails('Nishant');
car1(); // undefined
在你应该使用的其他变量中使用car的引用
var car1 = car.displayDetails.bind(car, 'Nishant');
car1(); // Nishant this is your car 007 Mercedes
让我们讨论bind函数的更广泛使用
var func = function() {
console.log(this)
}.bind(1);
func();
// Number: 1
为什么?因为现在func与编号1绑定，如果我们不使用bind，它将指向全局对象。
var func = function() {
console.log(this)
}.bind({});
func();
// Object
当您希望同时执行语句时，将使用Call、Apply。
var Name = {
work: "SSE",
age: "25"
}
function displayDetails(ownerName) {
console.log(ownerName + ", this is your name: " + 'age' + this.age + " " + 'work' + this.work);
}
displayDetails.call(Name, 'Nishant')
// Nishant, this is your name: age25 workSSE
// In apply we pass an array of arguments
displayDetails.apply(Name, ['Nishant'])
// Nishant, this is your name: age25 workSSE
当我们想要分配一个具有特定上下文的函数时，应该使用Bind函数。
var demo = {
getValue : function(){
console.log('demo object get value function')
}
setValue : function(){
setTimeout(this.getValue.bind(this),1000)
}
}
在上面的例子中，如果我们调用demo.setValue()函数并传递这个。getValue函数，那么它不会调用demo。setValue函数，因为setTimeout中的this指向窗口对象，所以我们需要将演示对象context传递给this。getValue函数使用bind。这意味着我们只是将demo对象的上下文传递给function，而不是实际调用function。
希望你能理解。
更多信息请参考 Javascript绑定函数详细了解
我认为它们的相同之处在于:它们都可以改变函数的this值。它们的区别是:绑定函数将返回一个新函数作为结果;call和apply方法将立即执行函数，但apply可以接受数组作为参数，并且它将解析分离的数组。绑定函数也可以是curiling。
Call:调用函数，允许你一个一个地传递参数
Apply: Apply调用函数并允许您将参数作为数组传递
Bind: Bind返回一个新函数，允许传入this数组和任意数量的参数。
var person1 = {firstName: 'Raju', lastName: 'king'}; var person2 = {firstName: 'chandu', lastName: 'shekar'}; function greet(greeting) { console.log(greeting + ' ' + this.firstName + ' ' + this.lastName); } function greet2(greeting) { console.log( 'Hello ' + this.firstName + ' ' + this.lastName); } greet.call(person1, 'Hello'); // Hello Raju king greet.call(person2, 'Hello'); // Hello chandu shekar greet.apply(person1, ['Hello']); // Hello Raju king greet.apply(person2, ['Hello']); // Hello chandu shekar var greetRaju = greet2.bind(person1); var greetChandu = greet2.bind(person2); greetRaju(); // Hello Raju king greetChandu(); // Hello chandu shekar
JavaScript调用()
const person = {
name: "Lokamn",
dob: 12,
print: function (value,value2) {
console.log(this.dob+value+value2)
}
}
const anotherPerson= {
name: "Pappu",
dob: 12,
}
person.print.call(anotherPerson,1,2)
JavaScript应用()
name: "Lokamn",
dob: 12,
print: function (value,value2) {
console.log(this.dob+value+value2)
}
}
const anotherPerson= {
name: "Pappu",
dob: 12,
}
person.print.apply(anotherPerson,[1,2])
**call和apply函数是不同的，调用单独的参数，但应用数组 如:(1、2、3) **
JavaScript绑定()
name: "Lokamn",
dob: 12,
anotherPerson: {
name: "Pappu",
dob: 12,
print2: function () {
console.log(this)
}
}
}
var bindFunction = person.anotherPerson.print2.bind(person)
bindFunction()
