JavaScript call、apply 和 bind 的区别
今天我们将解释 apply()、call() 和 bind() 方法之间的区别。使用这些 JavaScript 技术，你可以修改给定函数的 this 的值。
JavaScript 中的 function.call() 方法
function.call() 方法调用该函数并允许你使用逗号一次发送一个参数。这里提到的例子，this 指的是 person 对象，而 this.name 是 worker1 和 worker2 的名称。
例子：
let worker1 = { name: 'Oli', email: 'oli@gmail.com' };
let worker2 = { name: 'Kp', email: 'kp@hotmail.com' };
function invite(text) {
console.log(`${text} ${this.name}`);
}
invite.call(worker1, 'Hello Upwork');
invite.call(worker2, 'Hello Upwork');
输出：
"Hello Upwork Oli"
"Hello Upwork Kp"
JavaScript 中的 function.apply() 方法
你可以使用 function.apply() 方法调用具有提供的 this 值和作为数组提供的参数的函数。apply() 和 call() 方法相似，但不是单独的参数，而是将函数的参数作为数组。
例子：
let worker1 = { name: 'Oli', email: 'oli@gmail.com' };
let worker2 = { name: 'Kp', email: 'kp@hotmail.com' };
function invite(text, text2) {
console.log(`${text} ${this.name}, ${text2}`);
}
invite.apply(worker1, ['Hello', 'How are you?']);
invite.apply(worker2, ['Hello', 'How are you?']);
输出：
"Hello Oli, How are you?"
"Hello Kp, How are you?"
JavaScript 中的 bind() 方法
bind() 方法创建了一个新函数，该函数接受此数组和任意数量的参数。当你想稍后使用特定上下文（例如事件）调用函数时，请使用它。
例子：
let worker1 = { name: 'Oli', email: 'leo@gmail.com' };
let worker2 = { name: 'Kp', email: 'nat@hotmail.com' };
function invite(text) {
console.log(`${text} ${this.name}`);
}
let helloOli = invite.bind(worker1);
let helloKp = invite.bind(worker2);
helloOli('Hello');
helloKp('Hello');
输出：
"Hello Oli"
"Hello Kp"
以下示例是 Bind 实现。
例子：
Function.prototype.bind = function(context) {
var func = this;
return function() {
func.apply(context, arguments);
};
};
call 和 apply 是可以互换的。你可以选择是数组还是逗号分隔的参数列表更方便。Bind 和其他的不一样。
它每次都返回一个新函数。如示例所示，我们可以使用 Bind 来柯里化函数。
我们可以从一个简单的 hello 操作中创建一个 "helloOli" 或 "helloKp"。当我们不知道它们何时会被触发但它们将在什么上下文中时，它可以用于事件。
Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.
LinkedIn