前端面试必问之彻底搞懂this指向

this是JavaScript中的一个关键字，但它的使用相比较其他的关键字更复杂。
this会在执行上下文中绑定一个对象，在不同的执行条件下会绑定不同的对象。
接下来，我们一起来彻底搞定this到底是如何绑定的吧！

一、理解this

1.1 为什么使用this

使用this有什么意义呢？下面的代码中，我们通过对象字面量创建出来一个对象，在对象的几个方法中都使用到了对象中定义的name属性，
不使用this，那么我们的代码会是下面的写法：

let obj = {
   cat: "Tom",
   mouse: 'Jerry',
   hobby: function() {
      alert(`${obj.cat}喜欢追逐${obj.mouse}`);
   },
   eating: function() {
      alert(`${obj.cat}吃${obj.mouse}`);
   }
}

在方法中，使用cat和mouse的地方都需要通过obj的引用（变量名称）来获取。
但是这样做存在一个很大的弊端：如果我将obj的名称换成了story，那么所有方法中使用obj的地方都换成story.
事实上，在实际开发中，我们都会使用this来进行优化：

let obj = {
   cat: "Tom",
   mouse: 'Jerry',
   hobby: function() {
      alert(`${this.cat}喜欢追逐${this.mouse}`);
   },
   eating: function() {
      alert(`${this.cat}吃${this.mouse}`);
   }
}

通过对比就会发现，this可以让我们更方便的引用对象，易于复用。

1.2 this指向