JS的this指向是有点迷惑的，在不同环境中，不同调用方式下指向都有区别，但是JS中this指向最简单的记忆方法便是 this 指向是由调用者的调用方式决定的。
在理解 this 的绑定的过程之前，首先要理解调用位置：调用位置就是函数在代码中被调用的位置（而不是声明的位置）。
绑定规则：你必须找到调用位置，然后判断需要下面规则中的那一条
1、默认绑定：
首先是最常用的函数调用类型：独立函数调用。可以把这条规则看作是无法应用其他规则是的默认规则。
function foo(){
console.log(this.a);
}
var a = 2;
foo();//2声明在全局作用域中的变量（如 var a =2）就是全局对象上的一个同名属性。他们本质上就是同一个东西，并不是通过复制得到的，就像是要给硬币的两面一样。
在调用 foo() 时，this.a 被解析成了全局变量 a 。因为在本例中，函数调用时应用了 this 的默认绑定，因此 this 指向全局对象。怎么知道是应用了默认绑定呢？可以通过分析调用位置来看 foo() 是如何调用的。在代码中，foo() 是直接使用不带任何修饰的函数引用进行调用的，因此只能是默认绑定，无法应用其他规则。
下面这个例子同上。
var a = 10;
var func = {
a:20,
foo:function(){
bar();
}
}
function bar(){
console.log(this.a);
}
func.foo(); //10如果使用严格模式（strict mode），则不能将全局对象用于默认绑定，此时 this 绑定到 undefined。如下：
function foo(){
"use strict";
console.log(this.a);
}
var a = 2;
foo() // TypeError:this is undefined这里有一个微妙但非常重要的细节，虽然 this 的绑定规则完全取决于调用位置，但是只有 foo() 运行在非 strict mode 下时，默认绑定才能绑定到全局对象；在严格模式下调用 foo() 则不影响默认绑定：
function foo(){
console.log(this.a);
}
var a = 2;
(function(){
"use strict";
foo();//2
})()2、隐式绑定
另一条需要考虑的规则是调用位置是否有上下文对象，或者说是否被某个对象拥有或者包含，不过这种说法会造成一些误导。
function foo(){
console.log(this.a);
}
var obj = {
a:2,
foo:foo
};
obj.foo();//2首先需要注意的是 foo() 的声明方式，及其之后是如何被当作引用属性添加到 obj 中的。但是无论是直接在 obj 中定义还是先定义再添加为引用属性，这个函数严格来说都不属于 obj 对象。
然而，调用位置会使用 obj 上下文来引用函数，因此你可以说函数被调用时 obj 对象 “拥有”或者 “包含”它。
无论如何称呼这个模式，当 foo() 被调用时，他的前面确实加上了 obj 的引用。当函数引用有上下文对象时，隐式绑定规则会把函数调用中的 this 绑定到这个对象上下文对象。因为调用 foo() 时 this 被绑定到 obj，因此 this.a 和 obj.a 是一样的。
对象属性引用链中只有上一层或者说最后一层在调用位置中起作用。举例：
function foo(){
console.log(this.a);
}
var obj2 = {
a:42,
foo:foo
};
var obj1 = {
a:2,
obj2:obj2
}
obj1.obj2.foo();//42隐式丢失：
一个最常见的 this 绑定问题就是被隐式绑定的函数会丢失绑定对象，也就是说它会应用默认绑定规则，从而把 this 绑定到全局对象或者 undefined 上，取决于是否是严格模式。
function foo(){
console.log(this.a);
}
var obj = {
a:2,
foo:foo
};
var bar = obj.foo; //函数别名
var a = 'aaaa'; //a 是全局对象的属性
bar(); //aaaa虽然 bar 是 obj.foo 的一个引用，但是实际上，它引用的是 foo 函数本身，因此此时的 bar 其实是一个不带任何修饰的函数调用，因此应用了默认绑定。
一种更微妙、更常见并更出乎意料的情况发生在传入回调函数时：
function foo(){
console.log(this.a);
}
function doFoo(fn){
//fn 其实是引用的 foo
fn(); //调用位置
}
var obj = {
a:2,
foo:foo
};
var a = 'aaaa';
doFoo(obj.foo); //aaaa参数传递其实是一种隐式赋值，因此我们传入函数时也会被隐式赋值，所以结果和上一个例子一样。
如果把传入的函数传入语言内置的函数而不是传入你自己声明的函数，结果也是一样的，没有区别：
function foo(){
console.log(this.a);
}
var obj = {
a:2,
foo:foo
}
var a = 'aaaa'; // a 是全局对象属性
setTimeout(obj.foo,100); // aaaa就像我们看到的那样，回调函数丢失 this 绑定是非常常见的。除此之外，还有一种情况 this 的行为会出乎我们的意料：调用回掉函数的函数可能会修改 this。在一些流行的 JavaScript 库中时间处理器会把回调函数的 this 强制绑定到触发事件的 DOM 元素上。这在一些情况下可能很有用，但是有时他可能会让你感到非常郁闷。
无论是哪种情况，this 的改变都是意想不到的，实际上你无法控制回调函数的执行方式，因此就没有办法控制调用位置以得到期望的绑定。之后会介绍如何通过固定 this 来修复这个问题。
3、显示绑定
就像我们刚才看到的那样，在分析隐式绑定时，我们必须在一个对象内部包含一个指向函数的属性，并通过这个属性间接引用函数，从而把 this 间接（隐式）绑定到这个对象上。
那么如果我们不想在对象内部包含函数引用，而想在某个对象上强制调用函数，该怎么做呢？
JavaScript 中的“所有”函数都有一些有用的特性（这和它们的[[prototype]]有关），可以用来解决这个问题。具体点说，可以使用函数的 call(..) 和 apply(..) 方法。严格来说，JavaScript 的宿主环境有时会提供一些非常特殊的函数，它们并没有这两个方法。但是这样的函数非常罕见，JavaScript 提供的绝大多数函数以及你自己定义的函数都可以使用 call(..) 和 apply(..) 方法。
这两个方法是如何工作的呢？它们的第一个参数是一个对象，是个 this 准备的，接着在调用函数时将其绑定到 this。因为你可以直接指定 this 的绑定对象，因此我们称之为显示绑定。
思考下面的代码：
function foo(){
console.log(this.a);
}
var obj = {
a:2
}
foo.call(obj);//2通过 foo.call(..) ，我们可以在调用 foo 时强制把它的 this 绑定到 obj 上。
如果你传入了一个原始值（字符串类型、布尔类型、或者数字类型）来当作 this 的绑定对象，这个原始值会被转换成它的对象形式（也就是 new String(..)、new Boolean(..) 或者 new Number(..))。这通常被称为”装箱“。
从 this 的绑定角度来说，call(..) 和 apply(..) 是一样的，他们的区别体现在其他的参数上。
可惜，显式绑定任然无法解决我们之前提出的丢失绑定问题。
1.硬绑定
但是显式绑定的一个变种可以解决这个问题
思考下面的代码：
function foo(){
console.log(this.a);
}
var obj = {
a:2
}
var bar = function(){
foo.call(obj);
}
bar();//2
setTimeout(bar,100);//2
//硬绑定的bar 不可能再修改它的 this
bar.call(window); //2我们来看看这个变种到底是怎样工作的。我们创建了函数 bar()，并在它的内部手动调用了 foo.call(obj)，因此强制把 foo 的 this 绑定到了 obj。无论之后如何调用函数 bar ,它总会手动在 obj 上调用 foo。这种绑定是一种显式的强制绑定，因此我们称之为硬绑定。
硬绑定的典型应用场景就是创建一个包裹函数，负责接收参数并返回值：
function foo(something){
console.log(this.a,something);
return this.a + something;
}
var obj = {
a:2
};
var bar = function(){
return foo.apply(obj,arguments);
};
var b = bar(3);// 2,3
console.log(b);//5另一种使用方法是创建一个可以重复使用的辅助函数：
function foo(something){
console.log(this.a,something);
return this.a + something);
}
//简单的辅助函数
function bind(fn,obj){
return function(){
return fn.apply(obj,arguments);
}
}
var obj = {
a:2
};
var bar = bind(foo,obj);
var b = bar(3);//2 3
console.log(b); //5
由于硬绑定是一种非常常用的模式，所以 ES5 提供了内置的方法 Function.prototype.bind，它的用法如下：
function foo(something){
console.log(this.a,something);
return this.a + something;
}
var obj = {
a:2
};
var bar = foo.bind(obj);
var b = bar(3);//2 3
console.log(b);// 5bind(..) 会返回一个硬编码的新函数，它会把你指定的参数设置为 this 的上下文并调用原始函数。
2. API 调用的“上下文”
第三方库的许多函数，以及 JavaScript 语言和宿主环境中许多新的内置函数，都提供了一个可选的参数，通常称为“上下文”(context)，其作用和 bind(..) 一样，确保你的回调函数使用指定的 this。
举例来说：
function foo(el){
console.log(el,this.id);
}
var obj = {
id:'awesome'
};
//调用 foo(..) 时把 this 绑定到 obj
[1,2,3].forEach(foo,obj);
//1 awesome 2 awesome 3 awesome这些函数实际上就是通过 call(..) 或者 apply(..) 实现了显式绑定，这样你可以少写一些代码。
4、new 绑定
这是第四条也是最后一条 this 的绑定规则，在讲解它之前我们首先需要澄清一个非常常见的关于 JavaScript 中函数和对象的误解。
在传统的面向类的语言中，“构造函数”是类中的一些特殊方法，使用 new 初始化类时会调用类中的构造函数。通常的形式是这样的：
something = new MyClass(..);JavaScript 也有一个 new 操作符，使用方法看起来也和那些面向类的语言一样，绝大多数开发者都认为 JavaScript 中 new 的机制也和那些语言一样。然而，JavaScript 中 new 的机制实际上和面向类的语言完全不同。
首先我们来重新定义一下 JavaScript 中的“构造函数”。在 JavaScript 中，构造函数只是一些使用 new 操作符时被调用的函数。它们并不会属于某个类，也不会实例化一个类。实际上它们甚至都不能说是一种特殊的函数类型，它们只是被 new 操作符调用的普通函数而已。
举例来说，思考一下 Number(..) 作为构造函数时的行为，ES5.1中这样描述它：
当 Number 在 new 表达式中被调用时，它是一个构造函数：它会初始化新创建的对象。
所以，包括内置对象函数（比如 Number(..)）在内的所有函数都可以用 new 来调用，这种函数调用被称为构造函数调用。这里有一个重要但是非常细微的区别：实际上并不存在所谓的“构造函数”，只有对于函数的“构造调用”。
使用 new 来调用函数，或者说发生构造函数调用时，会自动执行下面操作：
- 1.创建（或者说构造）一个全新的对象。
- 2.这个新对象会被执行 [[prototype]]连接。
- 3.执行函数，并把这个新对象绑定到函数调用的 this。
- 4.如果函数没有返回其他对象，那么 new 表达式中的函数调用会自动返回这个新对象。
思考下面的代码：
function foo(a){
this.a = a;
}
var bar = new foo(2);
console.log(bar.a);//2使用 new 来调用 foo(..) 时，我们会构造一个新对象并把它绑定到 foo(..) 调用中的 this 上。new 是最后一种可以影响函数调用 this 绑定行为的方法，我们称之为 new 绑定。