Javascript 的 `bind()`、`call()` 和 `apply()`：我什么时候应该使用它们？

Javascript 的 bind() 与 call() 和 apply()：何时分别使用？

当 call() 和 apply() 时两者都用于在特定上下文中调用函数（通过在函数中设置 this 关键字），它们的主要区别在于参数传递给函数的方式。 call() 期望参数以逗号分隔的列表形式传递，而 apply() 需要参数数组。

使用 bind() 方法

与call() 和 apply()、bind() 不会立即调用该函数。相反，它返回一个新的绑定函数，稍后调用该函数时，该函数将具有用于调用原始函数的正确上下文集。这在您想要在异步回调或事件中维护上下文的情况下特别有用。

例如，考虑以下代码：

function MyObject(element) {
    this.elm = element;

    element.addEventListener('click', this.onClick.bind(this), false);
};

MyObject.prototype.onClick = function(e) {
     var t=this;  //do something with [t]...
    //without bind the context of this function wouldn't be a MyObject
    //instance as you would normally expect.
};

在 onClick 处理程序中， this 关键字将引用创建事件侦听器的 MyObject 实例，即使该事件是异步触发的。

何时使用 Call/Apply与 Bind

当您需要立即调用函数并修改其上下文时，请使用 call() 或 apply()。相反，当您希望稍后可以在特定上下文中（例如在事件中）调用该函数时，请使用bind()。

这是一个简单的说明：

var obj = {
  x: 81,
  getX: function() {
    return this.x;
  }
};

alert(obj.getX.bind(obj)()); // 81
alert(obj.getX.call(obj));   // 81
alert(obj.getX.apply(obj));  // 81

在所有三种情况下，输出为 81，因为所有函数都将调用 obj 上下文中的 getX 函数。然而，bind() 版本返回一个新函数，该函数在执行时将具有所需的上下文集。

以上是Javascript 的 `bind()`、`call()` 和 `apply()`：我什么时候应该使用它们？的详细内容。更多信息请关注PHP中文网其他相关文章！