this的深入理解

this的原理

this 是 JavaScript 中的一个关键字。
它通常被运用于函数体内，依赖于函数调用的上下文条件，与函数被调用的方式有关。
它指向谁，则完全是由函数被调用的调用点来决定的。
所以，this，是在运行时绑定的，而与编写时的绑定无关。
随着函数使用场合的不同，this 的值也会发生变化。但是有一个总的原则：
this 总会指向，调用函数的那个对象。

JavaScript 语言之所以有 this 的设计，跟内存里面的数据结构有关系。

var obj = { foo: function () {} };

JavaScript 引擎会将函数单独保存在内存中，然后再将函数的地址赋值给 foo 属性的 value 属性。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ow9DPrNZ-1649684507042)(https://user-gold-cdn.xitu.io/2019/1/19/16864091b7cf8373?imageView2/0/w/1280/h/960/format/webp/ignore-error/1)]

可以看到，函数是一个单独的值(以地址形式赋值)，所以才可以在不同的环境中执行。
又因为，JavaScript 允许在函数体内部，引用当前环境的其他变量。
所以需要有一种机制，能够在函数体内部获得当前的运行环境（context）。
所以，this就出现了，它的设计目的就是在函数体内部，指代函数当前的运行环境。

this 的用法

1、纯粹的函数调用

这是函数的最通常用法，属于全局性调用，因此 this 就代表全局对象 window

2、作为对象方法的调用

函数作为某个对象的方法调用，这时 this 就指这个上级对象。

3、作为构造函数调用

所谓构造函数，就是通过这个函数生成一个新对象（object）。这时，this 就指这个新对象。

4、apply调用

apply() 是函数对象的一个方法，它的作用是改变函数的调用对象，它的第一个参数就表示改变后的调用这个函数的对象。
因此，this 指的就是这第一个参数。apply() 的参数为空时，默认调用全局对象。

5、箭头函数

ES6 中的箭头函数，是在创建是指定的，指向父级作用域中的this