我如何使用呼叫，应用和绑定来控制'此”的价值。在JavaScript？

掌握call ， apply和bind在JavaScript：综合指南

本文探讨了call ， apply和bind在JavaScript中的细微差别，重点介绍了它们在控制this价值方面的使用。

如何使用call ， apply和bind来控制JavaScript中“此”的值？

在JavaScript中， this关键字是指拥有当前执行函数的对象。但是， this的价值可能是不可预测的，尤其是在作为回调传递或在事件处理程序中使用的功能中。 call ， apply和bind提供了一种明确设置this值的方法，使您可以精确控制功能上下文。

• call() ：此方法立即调用一个函数，将this值设置为传递给它的第一个参数。随后的参数作为单个参数将其传递给该函数。

 <code class="javascript">function greet(greeting) { console.log(greeting ", " this.name); } const person = { name: "Alice" }; greet.call(person, "Hello"); // Output: Hello, Alice</code>

• apply() ：类似于call() ， apply()也立即调用功能并设置this值。但是，它没有单个参数，而是接受参数的数组（或类似数组的对象）。

 <code class="javascript">function sum(a, b) { return ab this.value; } const obj = { value: 10 }; const numbers = [5, 3]; const result = sum.apply(obj, numbers); // Output: 18</code>

• bind() ：与call()和apply()不同， bind()不会立即调用函数。取而代之的是，它创建了一个新函数，当调用时，将其this值设置为提供的值。这对于创建部分应用的功能或确保在回调中保持一致的this很有用。

 <code class="javascript">function sayHello() { console.log("Hello, " this.name); } const person = { name: "Bob" }; const boundSayHello = sayHello.bind(person); boundSayHello(); // Output: Hello, Bob</code>

在JavaScript中call ， apply和bind之间有什么实际差异？

关键区别在于当他们执行功能以及如何处理参数时：

• call()和apply() ：这些方法立即执行该功能。 call()进行单独的参数，而apply()则采用一系列参数。对于少量固定的参数，请选择call() ，然后在有数组或可变数量的参数时apply() 。
• bind() ：此方法返回一个新功能，稍后将其键入该功能，将this绑定到指定值。它不会立即执行该功能。当您需要预先设置this上下文以进行以后执行时，例如使用回调或事件处理程序时，请使用bind() 。

如何使用call ， apply和bind来解决JavaScript中的常见“此”关键字问题？

常见的“此”问题出现在回调中（例如， setTimeout ， addEventListener ），而将作为参数传递给其他函数的方法。 call ， apply和bind要约解决方案：

• 回调：在回调中， this通常是指全局对象（浏览器中的窗口或以严格模式不确定）。 bind()在这里是理想的：

 <code class="javascript">const myObject = { name: "Charlie", logName: function() { console.log(this.name); } }; setTimeout(myObject.logName.bind(myObject), 1000); // Ensures 'this' refers to myObject</code>

• 方法传递为参数：将方法作为参数传递给另一个函数时， this上下文可能会改变。 call()或apply()可以维护正确的上下文：

 <code class="javascript">function processData(callback) { const data = { value: 20 }; callback.call(data, data.value); //Ensures this refers to the data object } function myCallback(val){ console.log("Value is: " val " and this.value is: " this.value); } processData(myCallback); // Output: Value is: 20 and this.value is: 20</code>

我什么时候应该选择call ， apply或bind以操纵JavaScript函数的上下文？

选择取决于特定情况：

• 立即执行单个参数：使用call() 。
• 立即执行一系列参数：使用apply() 。
• 延迟执行，预先this ：使用bind() 。

通过了解这些差异并适当地应用它们，您可以在JavaScript代码中有效地管理this上下文，避免出乎意料的行为并编写更强大和可维护的功能。

以上是我如何使用呼叫，应用和绑定来控制'此”的价值。在JavaScript？的详细内容。更多信息请关注PHP中文网其他相关文章！