前言

相信许多小伙伴们都被this 的指向问题所折磨过，this 它到底指向哪啊？今天咱们就来聊聊如何判别this 指向哪里，一盏茶的功夫让小伙伴们开心一整天！

文中所实例代码都运转在Chrome浏览器的Console控制台中。

先带咱们了解一个概念，在浏览器中运转代码时，window目标便是大局，因而一切在大局效果域中声明的变量，函数都会变成window目标的特点和办法。

this 的绑定规则

咱们用浅显易懂的话来说：

在非严厉模式下，当函数调用时无任何调用前缀的情景，也便是直接调用函数，（后边咱们会介绍非直接调用的情况），this 指向大局，在浏览器中也便是window

咱们来看一个简单的比方:

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

在此比方中，foo()便是直接调用，那么函数中的this就指向大局区，那么this.a输出1

再来看一个略微杂乱的比方：

var b = 2
function foo() {  // [[scope]]
  var b = 1
  function bar() {
    baz()
  }
  function baz() {
    console.log(this.b);
  }
  bar()
}
foo()

这个比方中无论函数声明在哪，在哪调用，由于函数调用时前面并未指定任何目标，而是直接调用，这种情况下this指向大局，输出2

2. 隐式绑定 — 当函数被一个目标所拥有，再调用时，此时this会指向该目标

假如函数被一个目标作为办法所调用时，那么this就会指向该目标。咱们来看一个比方：

function foo() {
    console.log(this.a);
  }
  var obj = {
    a: '来颗奇趣蛋',
    func: foo
}
obj.func()

foo函数体被目标obj所拥有，当obj调用时，this就会指向obj

咱们来看看输出成果：

3. 隐式丢掉 — 当函数被多个目标链式调用时，this指向引证函数的目标

浅显一点来说呢，比方有两个目标object 和 obj，例如这样调用一个函数，obj.object.func(),那么this会指向object(object所引证)，也可以说就近准则

咱们来看一个比方:

function foo() {
    console.log(this.a);
  }
var obj2 = {
    a: '菌菌',
    obj: obj
}
var obj = {
  a: '来颗奇趣蛋',
  func: foo
}
obj2.obj.func()

当obj被obj2所拥有时，而函数被obj所拥有，当函数被这样调用时obj2.obj.func()，this指向所引证函数的obj

让咱们来看看输出：

怎么样，是不是解决了你对this指向的问题的一大半疑问，下篇文章我会讲剩下的两种办法，小伙伴们记得一起来看看。

今天的内容就到这啦，假如你觉得小编写的还不错的话，或许对你有所启示，请给小编一个辛苦的赞吧