JS中this调用有几种情况
一：纯粹的函数调用
这是函数的最通常用法，属于全局性调用，因此this就代表全局对象Global。
var x = 1
function test(){
alert(this.x);
}
test(); // 1
var x = 2;
var obj = {
x: 1,
test: function() {
alert(this.x);
}
}
var copy = obj.test;
copy() // 2
var obj = {
test: function () {
console.log(this); // obj
var inner = function () {
console.log(this);
}
inner() // window
}
}
obj.test()
从第二个例子看出来对象中的方法如果通过复制的情况，其实就是把这个函数的指针传递了出去，所以这种情况this不再指向本身的对象。从第三个例子看出来我们如果想避免这种对象方法里还有函数的this指向不正确的情况可以通过var that = this来避免。
二：作为对象方法的调用
var x = 2;
var obj = {
x: 1,
test: function() {
alert(this.x);
}
}
obj.test(); // 1
函数也是对象所以
var bar = function () {
}
bar.fn = function () {
this // 指向bar函数
}
三 ：作为构造函数调用
首先我们知道构造函数的new过程具体发生了什么，所以this指向新创建出来的对象。
四：apply， call，bind
三中的构造函数的this为何会指向新的对象，主要原因还是源于apply的实现。
针对this指向我们看下列的题目
var boss1 = {
name: 'boss1',
returnThis () { return this }
}
var boss2 = {
name: 'boss2',
returnThis () { return boss1.returnThis() }
}
var boss3 = {
name: 'boss3',
returnThis () {
var returnThis = boss1.returnThis
return returnThis()
}
}
boss1.returnThis() // boss1
boss2.returnThis() // ?
boss3.returnThis() // ?
答案是boss1和window。
在boss2.returnThis里，使用this的函数是boss1.returnThis，所以this绑定到boss1；
在boss3.returnThis里，var returnThis = boss1.returnThis变成了纯粹的函数调用，所以this绑定到window。
要想把this绑定到boss2怎么做呢？
var boss2 = {
name: 'boss2',
returnThis: boss1.returnThis
}
boss2.returnThis() //boss2
这样子为什么可以绑定到boss2上呢？因为这里的boss1.returnThis并没有调用，只是传递了下值。
五 箭头函数中的this
箭头函数的this是根据外层（函数或者全局）作用域来决定this，箭头函数会捕捉调用父函数时候父函数的this
补充 事件中的this
- attachEvent的this总是Window
- 脚本设置onclick方式的事件绑定， this总是指向被设置的DOM元素
document
.getElementById('l1')
.onclick = function(){
console.log(this);
};
- HTML中设置onclick方式的事件绑定
<p id="click" onclick="console.log(this)">点我</p> // 指向当前的DOM元素p
<p id="click2" onclick="test()">点我</p> // 指向windown
function test() {
console.log(this)
}
- addEventListener方式的事件绑定的this总是当前绑定事件的那个DOM对象。
