一、几个问题
JavaScript中的this代表什么？和Java对象里面的this或Objective-C里的self是否有相同的含义？
// demo 1
var a = 2;
function hello() {
console.log(this.a);
}
hello(); // a打印值为？
// demo 2
var a = 2;
function hello() {
console.log(this.a);
}
var obj = {
a: 3,
hello: hello
}
obj.hello(); // a打印值为？
// demo 3
var a = 2;
function hello() {
console.log(this.a);
}
var obj = {
a: 3,
hello: hello
}
var hello2 = obj.hello;
hello2(); // a打印值为？
// demo 4
var a = 2;
function hello() {
console.log(this.a);
}
var obj = {
a: 3,
hello: hello
}
setTimeout(obj.hello, 1000);
二、this的含义
JavaScript中this含义和Java中的this及Objective-C中的self不同，指的不是当前对象。Javascript中this的真正理解应该为当前执行函数的上下文，具体值和函数的调用方式有关。
function hello(context) {
console.log(context.a);
}
var obj1 = {
a: 1
}
var obj2 = {
a: 2
}
hello(obj1); // 1
hello(obj2); // 2
上面的代码模拟了一下this的用途，hello函数执行时传入不同的context时，会得到不同的运行结果，因为hello函数运行在不同的的上下文中。相比于上面的context方式，this提供了更加优雅机制来实现上面相同的功能。
function hello() {
console.log(this.a);
}
var obj1 = {
a: 1,
hello: hello
}
var obj2 = {
a: 2,
hello: hello
}
obj1.hello(); // 1
obj2.hello(); // 2
三、this所绑定的对象
在函数运行时，this所绑定的对象和该函数的调用方式有关系，一般来说有四种情况：
3.1、new绑定
JavaScript中，
var obj = {
key: value,
...
};
这种形式的就叫做一个JavaScript对象。除了这种对象的创建方式，也可以通过new关键字来创建
function hello(message) {
this.message = message;
}
var obj = new hello("HELLO WORLD!!!");
console.log(obj.message); // HELLO WORLD!!!
通过new关键字来调用hello时，hello里面的this就自动绑定到了新创建的对象obj上。
3.2、显示绑定
JavaScript对象都内置有call和apply函数，可以通过call或者apply来启动调用一个函数，并明确指定该函数中this所绑定的对象。
function hello() {
console.log(this.a);
}
var obj1 = {
a: 1
}
var obj2 = {
a: 2
}
hello.call(obj1); // 1
hello.call(obj2); // 2
3.3、隐式绑定
如果通过对象属性的方式来调用一个函数，那么该函数的this就会自动绑定到该对象上
function hello() {
console.log(this.a);
}
var obj1 = {
a: 1,
hello: hello
}
var obj2 = {
a: 2,
hello: hello
}
obj1.hello(); // 1
obj2.hello(); // 2
并且，在对象的属性引用链中，最后最后一层起到作用。下面的例子中，hello函数的this绑定的对象为obj1。
function hello() {
console.log(this.a);
}
var obj1 = {
a: 1,
hello: hello
}
var obj2 = {
a: 2,
obj1: obj1
}
obj2.obj1.hello(); // 1
有一点需要注意，隐私绑定绑定的是在表达式执行时所属的对象。现在我们回答demo3的问题，demo3的打印值应该为undefined（严格模式）或2（非严格模式）。
// demo 3
var a = 2;
function hello() {
console.log(this.a);
}
var obj = {
a: 3,
hello: hello
}
var hello2 = obj.hello;
hello2(); // a打印值为？
demo3的代码中，var hello2 = obj.hello; 语句将函数地址赋值给了hello2变量，该执行语句并不是函数调用而是一个赋值语句，所以这句可执行语句不能决定this要绑定的对象。真正决定this所绑定对象的是 hell2(); 这句。可以看到这句可执行语句并不符合隐私绑定的形式，实际上它是一个默认绑定，这是接下来要讲的内容。
3.4、默认绑定
什么是默认绑定？如果一个函数的调用不满足new绑定、显示绑定、隐私绑定，那么它就是一个默认绑定。如demo1、demo2。默认绑定后，this所绑定的对象有两种情况：如果JavaScript运行在严格模式下，this绑定到了undefined上；如果JavaScript运行在非严格模式下，this就绑定到了全局对象上。
3.5、四种绑定的优先级顺序
new绑定 > 显示绑定 > 隐式绑定 > 默认绑定。
下面的例子表明了，如果同时满足显示绑定和隐式绑定，则起作用的是显示绑定。
function hello() {
console.log(this.a);
}
var obj1 = {
a: 1,
hello: hello
}
var obj2 = {
a: 2,
hello: hello
}
obj1.hello.call(obj2); // 2
obj2.hello.call(obj1); // 1
下面的例子表明了，如果同时满足new绑定和显示绑定，则起作用的是new绑定。
function hello(message) {
this.message = message;
return {
message: message
}
}
var obj = {
message: ""
};
var hello2 = hello.bind(obj);
hello2("我是显示绑定！");
var hell3 = new hello2("我是new绑定！");
console.log(obj.message); // 我是显示绑定！
console.log(hell3.message); // 我是new绑定！
3.6、箭头函数
ES6中，新引入了箭头函数。箭头函数不满足以上四种规则，它的this对象来自外层作用域中this多绑定的对象。
function hello() {
return (a) => {
console.log(this.a);
}
}
var obj1 = {
a: 1
}
var obj2 = {
a: 2
}
var hello2 = hello.call(obj1);
hello2.call(obj2); // 1
可以看到，hello中返回的箭头函数实际上是一个闭包，该闭包捕获了hello的this对象，且无法通过显示绑定修改。
hello2.call(obj2)；语句虽然想要将箭头函数显示绑定到obj2对象中，但失败了。
四、一些解释
// demo 4
var a = 2;
function hello() {
console.log(this.a);
}
var obj = {
a: 3,
hello: hello
}
setTimeout(obj.hello, 1000);
demo4最后应用的是默认绑定，那么问题来了，如果我想要通过setTimeout函数调用hello，并且调用时绑定到obj对象上，那么我应该如何实现呢？见下面的代码所示：
function bind(fn, obj) {
return function(arg) {
return fn.call(obj, arg);
};
}
var a = 2;
function hello() {
console.log(this.a);
}
var obj = {
a: 3,
hello: hello
}
var hello2 = bind(hello, obj);
setTimeout(hello2, 1000);
可以通过bind来实现，bind是使用显示绑定，通过构造一个包裹函数，该包裹函数将hello强制绑定到obj对象上，从而实现我们的目的。bind函数的用途非常常见，以至于JavaScript已经内置了该函数，在3.5中的代码示例中我们已经展示过相关使用。
参看《你不知道的JavaScript（上卷）》
