在明白javascript的this之前，起首先相识一下作用域。

作用域分为两种：

1、词法作用域：引擎在当前作用域或许嵌套的子作用域查找具有称号标识符的变量。（引擎怎样查找和在哪查找。定义历程发生在代码誊写阶段）
2、动态作用域：在运转时被动态肯定的作用域。

词法作用域和动态作用域的区别是：词法作用域是在写代码或定义时肯定的；动态作用域是在运转时肯定的。

this的绑定划定规矩

this是在挪用时被绑定，取决于函数的挪用位置。由此能够晓得，平常状况下（非严厉情势下），this都邑依据函数挪用（挪用栈）的上下文来绑定对象。

一、默许绑定

默许绑定：默许绑定是指在非严厉情势下，且没有应用别的绑定划定规矩时，this依据函数挪用（挪用栈）的上下文来绑定对象（全局对象）。（严厉情势下则绑定undefined）

举个栗子：

function foo() {
    console.log(this.a);
};
function bar() {
    var a = 3;
    foo();
}
var a = 2;
bar();  //挪用栈在全局作用域，this绑定全局对象

运转结果为： 2
//加上"use strict"运转结果则会变成this is undefined

这里的函数挪用时，应用了默许绑定，函数挪用（挪用栈）的上下文是全局作用域，因而this绑定了全局对象（global）。

eg2:
function foo() {
    console.log(this.a)
};
var a = 2;
(function() {
    "use strict"
    foo();
})();

运转结果为： 2

这里须要注重：关于默许绑定，决议this绑定对象的不是挪用位置是不是处于严厉情势，而是函数体是不是处于严厉情势（函数体处于严厉情势则this绑定undefined；不然this绑定全局对象）。别的：严厉情势和非严厉情势虽然有能够能够绑定，然则最好不混用。

间接援用平常也是会应用默许绑定划定规矩。

eg:
function foo() {
    console.log(this.a);
};
var a = 2;
var o = { a: 3, foo: foo };
var p = { a: 4 };
o.foo();   //3
(p.foo = o.foo)();  //2

赋值表达式 p.foo = o.foo的返回值是直接援用目的函数foo。

二、隐式绑定

隐式绑定：由上下文对象挪用，绑定到上下文对象。

举个栗子：

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

这段代码中，foo()被当作援用属性添加到obj对象中，obj挪用这个援用属性函数时，会应用该援用属性上下文，this会被绑定到obj对象。（这个函数严厉来说不属于obj对象，只是作为援用属性）。属于隐式绑定。

而下面foo()函数的直接实行，并非obj对象援用，所以上下文对象是全局对象。故this绑定了undefined。属于默许绑定。

对象援用链中只要上一层或许说末了一层在挪用位置中起作用。

注重：

1. 隐式绑定的函数会丧失绑定对象。此时它会应用默许绑定，将this绑定到全局对象或许undefined上，取决于是不是是严厉情势。
   eg:

   function foo() {
       console.log(this.a);
   };
   var obj = {
       a: 2;
       foo: foo
   }
   var bar = obj.foo;
   var a = 'biubiubiu';
   bar();
   
   运转结果："biubiubiu"

   剖析：看似bar是obj.foo的一个援用，现实上bar是直接援用了函数foo，是一个纯真的函数挪用，故实为默许绑定。

2. 参数通报就是隐式赋值，因而传入函数时也会被隐式赋值。
   eg:

   function foo() {
       console.log(this.a);
   };
   var obj = {
       a: 2,
       foo: foo
   };
   function bar(fn) {
       fn();
   };
   var a = "biubiubiu";
   bar(obj.foo);
   
   运转结果: "biubiubiu"

   剖析：现实上参数也是隐式赋值，然则参数传入函数中，并在函数中实行。此时也是直接援用了函数foo，因而也是纯真的函数挪用，采用了默许绑定。

3. 把函数传入言语内置函数。（与上面状况基础类似，将本身声明函数改成言语内置函数）回调函数丧失this的状况比较罕见，何况另有挪用回调函数的函数能够还会修正this。

三、显式绑定

显式绑定：直接将this绑定到指定对象上。Javascript中绝大多数函数和本身所建立的函数都能够应用这两种显式绑定的要领。

1、.call()
2、.apply()
这两种绑定要领，第一个参数是this绑定的对象。（假如传入的参数是原始值（字符串范例、布尔范例、数字范例），这个原始值就会被转成对象情势（new String、new Boolean、new Number）这个称为：装箱）

举个栗子：

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

运转结果： 2

然鹅，显现绑定并不能处理绑定丧失的题目。这个时刻来了一名新朋侪 — 硬绑定（bind）。

3、.bind() （硬绑定是罕见场景，故es5供应了该内置要领 Function.prototype.bind。）
bind()会返回一个新编码函数，把this绑定在指定参数上，并挪用函数。

举个栗子：

function foo(e) {
    console.log(this.a + e);
    return this.a + e;
};
var obj = {
    a: 2
}
var bar = foo.bind(obj); //新编码函数
var b = bar(3); // 2 3
console.log(b); // 5

bind()另有一个功用：将除了第一个用于绑定this的参数以外的其他参数传给基层的函数（部份应用，是“柯里化”的一种）。

这里涉及到一个观点：把null或许undefined作为this的绑定对象传入call、apply、bind，这些值在挪用的时刻会被疏忽，现实应用默许绑定划定规矩。
应用场景：
1、应用apply()睁开一个数组，并作为参数通报给一个函数。
2、bind()对参数举行柯里化（预先设置一些参数）。

举个栗子：

function foo(a,b) {
    console.log("a:" + a + ",b:" + b);
};
//数组“睁开”成参数
foo.apply(null,[2,3]);  //a:2,b:3
//bind()柯里化
var bar = foo.bind(null,2);
bar(3);  //a:2,b:3

剖析：传入一个参数作为this绑定对象，假如不传则应用占位符（null），此时会应用默许绑定划定规矩。

上面这个例子能够会发生肯定的副作用，假如须要应用这类场景而且越发平安。能够建立一个空对象（能够用恣意喜好的名字来定名）。

var ∅ = Object.create(null);
//上面这个例子就能够改写为：
foo.apply(∅,[2,3]); //a:2,b:3
var bar = foo.bind(∅,2);
bar(3);  //a:2,b:3

注重：硬绑定以后不能应用隐式绑定和显式绑定对this举行修正
在这里引见一种软绑定的要领softBind()，搜检this绑定到全局对象或许undefined后，绑定this到指定的默许对象。绑定后结果和硬绑定一样，然则保存隐式绑定或许显式绑定修正this的才能。

四、new绑定

Javascript中的new机制与面向类言语的完整差别。在Javascript中，组织函数只是一些应用new操作符时被挪用的函数，不属于一个类，也不会实例化一个类。称为对函数的“组织挪用”。

举个栗子：

function foo(a) {
    this.a = a;
}
var bar = new foo(2);
console.log(bar.a); //2

应用new的历程会建立一个全新的对象，this会绑定这个新对象。假如函数没有返回其他对象，则new表达式函数挪用会返回该新对象。（这个新对象会衔接prototype）

四种绑定划定规矩的优先级为：new>显式>隐式>默许

箭头函数

箭头函数是依据外层作用域（函数或全局）来决议this。（词法作用域庖代this机制）
箭头函数this会绑定挪用时的对象，且箭头函数的绑定没法修正（new也不可）。

实在能够明白为，箭头函数的this在词法上继续的是它地点的作用域（函数或全局）的this，而它继续的函数作用域的this绑定的是在该函数挪用上下文对象，所以箭头函数的this间接的绑定在挪用上下文对象。

简述： 箭头函数this（绑定作用域this）– 作用域this（绑定在挪用上下文对象）。

故：箭头函数this == 挪用的上下文对象

举个栗子：

function foo() {
    setTimeout(function() {
        //这里的this在词法上继续自foo()
        console.log(this.a);
    },100);
};
var obj = { a: 2 };
foo.call(obj);  //2

实在这个栗子也等价于：

function foo() {
    var that = this;  //lexical capture of this
    setTimeout(function() {
        console.log(self.a)
    },100);
}
...与上面一样

所以，有两种作风：this作风（四种划定规矩）和词法作用域作风（that = this和箭头函数）可供应用。应用时只管防止混用，不然会形成难以保护的效果。