this的指向

调用位置

每个函数的 this 是调用时被绑定的，所以 this 的指向完全取决于函数的调用位置。

那什么是调用位置呢？我最直接的理解就是函数在被调用时的位置，但是吧这个听起来好像还挺简单的。

但要真的找起来其实并不简单，因为某些编程模式可能会隐藏真正的调用位置。

那该如何找呢？这就要分析调用栈了（分析当前执行位置所调用的所有函数）那么要找的就是当前正在执行的函数的前一个调用中

调用栈是用来管理函数调用关系的一种数据结构。 每调用一个函数，javascript 引擎会为它创建执行上下文，并压入调用栈，然后开始执行函数代码。 当函数 A 调用函数 B 时，javascript 引擎先将 A 函数执行上下文压入栈，执行到 B 函数时，再将 B 函数执行上下文压入栈。B 函数执行完毕后，javascript 引擎将该函数执行上下文弹出栈，上下文控制权移到 A 函数执行上下文 中。A 函数执行完毕后上下文控制权移至全局执行上下文。 调用栈有最大栈容量和最大调用深度两个指标，超出其中一个就会栈溢出。

function baz() {
  // 当前调用栈是：baz
  // 因此，当前调用位置是全局作用域
  console.log("baz", this); // Window
  bar(); // bar的调用位置
}

function bar() {
  // 当前调用栈是：baz --> bar
  // 因此，当前调用位置是baz中
  console.log("bar", this); // Window

  foo() // foo的调用位置
}

function foo() {
  // 当前调用栈是：baz --> bar --> foo
  // 因此，当前调用位置是bar中
  console.log("foo", this); // Window
}

通过上面的代码我们可以验证出，可以通过函数调用栈来确认函数调用位置。从而找到 this的指向 的一些规则

绑定规则

总结判断this的一些技巧

1. 由 new 调用？绑定到新创建的对象。
2. 由 call 或者 apply 或者 bind 调用？绑定到指定的对象。
3. 由上下文对象调用？绑定到那个上下文对象。
4. 默认：严格模式下绑定到undefined，否则绑定到全局对象。
5. 箭头函数是根据当前的词法作用域来决定this，也就是箭头函数会继承外层函数调用的this绑定。