关于js中的this

从字面上理解this就是本身，所以this的指向就是本身，关键就是搞清楚本身指的是什么。

首先这个本身不是指函数本身，也不是指函数的词法作用域。

this是在函数调用时发生的绑定，它的指向完全取决于函数是如何调用的。当一个函数被调用时，就会创建一个活动记录（或者说是执行上下文），这个记录会包含函数在哪里调用、函数的调用方式（接下来会讲到）、传入的参数等信息，而this就是这个记录的一个属性。

接下来讲函数的4种调用方式，同时这4种方式也决定了this的4种绑定方式。

1 默认绑定

也许你已经知道在全局下定义的变量默认就成为了window的属性，比如你在全局下定义了 var a = 2;那么你可以通过window.a访问到a的值。对于函数也是一样，但是要注意的是，这个机制在全局下是会报错的。

2 隐式绑定

这是语言中很常见的一种绑定

function foo(){
    console.log(this.a);
}
var obj = {
    a:2,
    foo:foo,
}
var obj2 = {
    a:42,
    obj1:obj1
}
obj.foo;//2
obj2.obj1.foo //2 

需要注意的是隐式丢失的问题

思考以下代码

function foo(){
    console.log(this.a);
}
var obj = {
    a:2,
    foo:foo,
}
var bar = obj.foo;
var a = "200";
bar()                      //200

 这里边有一个赋值操作：var bar=obj.foo,使得bar成为obj.foo的一个引用，但是bar引用的就是foo这个函数，bar并没有隐式的上下文，因此便采用了默认上下文window。

另一种比较微妙的但也很常见的一种情况是函数作为参数传递时。

function foo(){
    console.log(this.a);
}
function doFoo(fn){
    fn()
}
var obj = {
    a:2,
    foo:foo,
}
var a="200"
doFoo(obj.foo);  //200

在参数传递时，其实发生了隐式的赋值操作，即fn = obj.foo,所以本质上和上例一样。js中的ajax和setTimeout等函数都有函数作为参数，使用的时候应当注意。

3 显示绑定

显示绑定可以使我们更加自由的将函数绑定到特定的上下文。js中的绝大多数函数都会有call和apply方法（极少数没有），你可以利用call或者apply显式的指定函数的执行上下文，它们的区别只是传入的参数不同。

还有一个bind,用法相似，也是常用的一种绑定方式

function foo(){
    console.log(this.a);
}
var obj = {
    a:2,       
}
fn.call(obj) //2 

关于两者区别这里就不多说了。 

4 new绑定

大家都知道new是用来调用构造函数的，但是在js中并不存在真正的构造函数，js中任何一个函数都可以被new调用，所以构造一个对象时，真正起构造作用的是new，而不是函数。在《你不知道的JavaScript》中作者是这样讲的“实际上并不存在所谓的‘构造函数’，只有对于函数的‘构造调用’”，大家可以领会一下。

需要理解的是new的过程是怎样的，例如

function Foo(a){
    this.a = a;
}
var bar = new Foo(2)
bar.a     //2

这个过程可以简单理解为以下4步

1 创建一个全新的对象。

2 这个全新的对象会被执行[[Prototype]]连接。

3 这个全新的对象会绑定this（我觉得就是执行了a = this）

4 默认返回这个对象（前提是这个构造函数没有返回值）

所以在new的第三步执行了this的绑定

箭头函数

ES6中新增了箭头函数的语法，不但更加简洁，而且有的时候可以很好的解决this绑定的问题。箭头函数的语法如下

function foo(){
    return (a)=>{
        console.log(this.a)
    }
}

在箭头函数里是没有this的，所以这里箭头函数中的this实际上是外层的this，箭头函数只是做了一个变量查找的过程。思考以下代码：

function foo(){
    return (a)=>{
        console.log(this.a)
    }
}
var obj1={
    a:2
}
var obj2={
    a:3
}
var bar = foo.call(obj1)
bar.call(obj2) //2

foo中的箭头函数中的this会捕获调用foo时的this，由于foo的this绑定到obj1，所以bar(引用的是箭头函数)的this也是指向obj1，箭头函数的this 来自于上层，是违法被修改的（new也不会）

关于this的绑定可以参考《你不知道的JavaScript》这本书里边的内容，讲的很深入很具体，同时还讲了几种绑定规则同时使用时的优先级和绑定到null