我已经知道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, 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
其他回答
function sayHello() {
//alert(this.message);
return this.message;
}
var obj = {
message: "Hello"
};
function x(country) {
var z = sayHello.bind(obj);
setTimeout(y = function(w) {
//'this' reference not lost
return z() + ' ' + country + ' ' + w;
}, 1000);
return y;
}
var t = x('India')('World');
document.getElementById("demo").innerHTML = t;
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允许您现在设置this值，同时允许您在将来执行该函数，因为它返回一个新的函数对象。
bind:它将函数与所提供的值和上下文绑定，但不执行函数。要执行函数，需要调用函数。
调用:它使用提供的上下文和参数执行函数。
apply:它使用提供的上下文和执行函数 参数作为数组。
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()
