简明扼要javascript中this指向。

概述

关于this指向，有个误区就是“this”指向调用的函数。其实不然，提到this指向，需要详细讲到apply，call，bind，new等方法以及箭头函数，点运算符。

一、独立调用
在独立调用的时候，要分两种情况：严格模式和非严格模式。

1. 非严格模式下:
   独立调用的时候this指向window（浏览器中）,或者为undefined(nodejs中)。

//浏览器中
function foo(){
    let a = 2;
    console.log(this.a)
}
var a = 3;
foo()//3

//nodejs中
function foo(){
    var a = 2;
    console.log(this.a)
}
var a = 3;
foo()//undefined，此时this指向一个空对象{}

1. 严格模式下
   在严格模式下。独立调用函数中this都为undefined.

function foo(){
    "use strict"
    let a = 2;
    console.log(this.a)
}
var a = 3;
foo()//此时this为undefined

二、点运算符
当函数被作为另外一个函数的属性调用时候，被调用函数中的this指向调用的函数。

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

三、箭头函数
箭头函数比较特别，其中的this是在编译的时候确定指向的(在别的情况下this都是在执行的时候确定指向)。
在es6的箭头函数中，this会在编译的时候绑定上一层函数或全局。

function foo(){
    return (a) => {
        console.log(this.a)
    }
}
var obj1 = {
    a:1
}
var obj2 ={
    a: 2
}
//箭头函数中的this绑定到foo上。
var bar = foo.call(obj1);
bar.call(obj2)//1

四、new
在构造函数中，this会被绑定到实例中。

function foo(a){
    this.a = a
}
var bar = new foo(3)
bar.a//3

五、call、apply、bind
这三个函数都是起到函数中的this绑定到第一个参数中。

function foo(){
    console.log(this.a)
}
var obj = {
    a:1
}
foo.call(obj)//1
foo.apply(obj)//1
foo.bind(obj)()//1

至于三者之间的区别不是本文重点，所以可以简单的理解为:

bind大部分作为返回使用，call和apply则会立即执行。
apply的参数为一个数组，call的参数为一一传入的，当参数数量不定的时候使用apply。