彻底搞懂JavaScript中this指向

彻底搞懂JavaScript中this指向

在面向对象的编程语言中几乎都有类似this的关键字，如Java、C++、Swift中的this，Python、Object-C中的self，但是Javascript中的this和它们还不太一样，面向对象的编程语言中this通常会出现在类方法中，代表着当前调用对象，而Javascript中的this则更加灵活复杂。JavaScript中this是一个很特别的关键字，被自动定义在所有函数的作用域中，MDN中提到JavaScript的this是当前执行上下文的一个属性，在非严格模式下，总是指向一个对象，在严格模式下可以是任意值。那么，JavaScript中到底为什么要用到this?它的this又是以一种什么样的机制进行绑定的呢？

一、为什么使用this

我们看下面这样一段代码，如果没有this，我们想要获取到这个对象的的名字必须通过对变量的引用Tom.name来实现，这种显式引用的方法显然是不合适的，如果有一天需要对变量名称进行修改，那么对象中的引用也必须全部进行修改。

var Tom = {
   
  name: 'Tom',
  speaking: function () {
   
    console.log(`${
     Tom.name} say boh`)
  },
  language: function () {
   
    console.log(`${
     Tom.name}'s mother tongue is Chinese`)
  },
  hobby: function () {
   
    console.log(`${
     Tom.name} love eating, sleeping and playing peas`)
  },
}

当我们有了this以后，完全可以以一种更加优雅的方式进行引用，使得代码更加简洁，复用性更强。实际上，this给我们带来的便利远不止这么简单。

var Tom = {
   
  name: 'Tom',
  speaking: function () {
   
    console.log(`${
     this.name} say boh`)
  },
  language: function () {
   
    console.log(`${
     this