JS中this的4种绑定规则详解

下面是对于“JS中this的4种绑定规则详解”的完整攻略：

1. 默认绑定规则

默认绑定规则是指，在函数调用时，若函数调用时调用点没有指定调用的对象，this会绑定在全局对象上，即window（在浏览器环境下）。

示例代码如下：

function foo() {
  console.log(this.a);
}

var a = 2;
foo(); // 输出2

在上面的代码中，因为foo()函数是通过默认的方式调用的，所以this会指向全局对象window，最终输出的结果是2。

2. 隐式绑定规则

如果函数以“对象.方法()”的形式来调用，那么在该方法内部，this会被自动绑定到该调用的对象上。

示例代码如下：

function foo() {
  console.log(this.a);
}

var obj = {
  a: 42,
  foo: foo
}

obj.foo(); // 输出42

在这个例子中，因为调用foo()函数时使用了“obj.foo()”的形式来调用，所以this就会指向obj这个对象。因此，最终输出的结果是42。

3. 显示绑定规则

如果我们在调用一个函数时，明确地指定了this应该绑定到哪个对象上，那么就使用显示绑定规则。可以使用call()或apply()方法来完成。

示例代码如下：

function foo() {
  console.log(this.a);
}

var obj = {a: 42};

foo.call(obj); // 输出42

在这个例子中，我们将foo()函数的this绑定到obj对象上，然后调用该函数，输出结果是42。

4. new绑定规则

如果我们用new关键字来调用一个函数，那么这个函数会被作为构造函数来使用。在这种情况下，this会被绑定到新创建的对象上。

示例代码如下：

function foo(a) {
  this.a = a;
}

var bar = new foo(42);
console.log(bar.a); // 输出42

在这个例子中，我们使用new关键字来调用了foo()函数，创建了一个新的对象bar，然后将this绑定到bar对象上。最终输出的结果就是42。

以上就是关于“JS中this的4种绑定规则详解”的完整攻略。