JavaScript 中 关于 this 的学习笔记
今天上午主要学习了js中的 this ,因为之前学习面向对象时，this这个东西出现的还是很频繁的，理解的很不透彻，感觉老被JAVA的思想带进坑里，所以对它特别关注。
首先贴一个大神的一篇博客，我是通过这篇博客对this的认识和了解有了很大的提升，下面是传送门
foocoder----详解JavaScript中的this
首先，解释一下this到底是个什么东西。我找到的解释是这样的（读起来有点绕）
this是包含它的函数作为方法被调用时所属的对象。
this是包含它的函数作为方法被调用时所属的对象。
this是包含它的函数作为方法被调用时所属的对象。
重要的事情说三篇！下面列举一下this出现的几种情况。
第一种情况，全局代码中的this
alert(this)//window
第二种情况，普通的函数中调用的this（我说的普通，就是表示大家经常会写出来的那种。。。就是在全局作用域中调用的函数，例子如下）。
function fooCoder(x) {
this.x = x;
}
fooCoder(2);
alert(x);// 全局变量x值为2
这里的this包含在 fooCoder 函数中，而函数是被直接调用的（也就是在window中调用的），所以这个this指向window
第三种情况，构造函数中的this（之前见过许多次）
function Person(name){
this.name = name;
};
var tom = new Person("tom");
这里的this 指向的是通过构造函数 new 出来的那个tom对象。因为tom调用了 this所在的Person函数。
第四种情况，对象的方法中调用的this
Person.prototype.say = function (){
console.log(this.name +" say hello~");
}
这里的this 指向的是调用这个方法的对象。例如tom.say()，这时this指向的是tom。原理同上
第五种情况，this出现在内部函数中调用 类似这样
this.name = "jerry";
Person.prototype.sayHello = function(){
sayfun = function(){
alert(this.name+" hello")
}
sayfun();
//alert(this.name);
}
var tom = new Person("tom");
tom.sayHello();//jerry hello
最外层的this就是第一种情况所说的全局环境直接调用this，这时候this就是window。
调用创建出来的对象 tom上的sayHello()函数，函数中包含一个内部函数sayfun()，这个内部函数中的this本来应该代表的是tom，但是当你运行程序后就发现alert 出来的 是 "jerry hello",就说明 这里的this 指向了window。
为什么会这样呢？ 首先找找看到底是谁调用了 sayfun()函数。这里可能会误解为是tom这个对象调用了sayfun函数，其实真相是 tom调用了sayHello函数，而sayHello函数内部执行了sayfun函数，并不是tom调用的。那是谁调用的？这种直接调用的一般都是window干的。所以这里的this还是指向window的。
如果想要实现想要的效果，让this指向tom,可以进行这样分析一下：
tom调用了sayHello函数，那么sayHello函数中的this就还是指向tom的。而sayfun作为sayhello函数的内部函数是可以访问到sayhello函数的作用域的，所以我们在sayhello函数中保存一下this（比如把他保存为that）就可以让sayfun访问到这个保存的值。代码实现如下：
function Person(name){
this.name = name;
}
this.name = "jerry";
Person.prototype.sayHello = function(){
var that = this;
sayfun = function(){
alert(that.name+" hello")
}
sayfun();
//alert(this.name);
}
var tom = new Person("tom");
tom.sayHello();//tom hello
第六种情况，在apply(),call()这两个函数中的this。一般的实现是这样的
fun.call( this [，arg1，arg2，… ] ); // 参数列表，arg1，arg2，... fun.apply(this [，argArray] ); // 参数数组，argArray
两者都是将某个函数绑定到某个具体对象上使用。这种情况之后下一篇专门分析。
除了以上几种情况外，还有关于事件处理函数中的this，也比较特殊，但是如果掌握里上面理解this的方法，也会变得很轻松。这部分内容我参考了这篇博客
浏览器有三种添加事件监听的方式。
第一种：直接在标签内写 onclick=“fn”
第二种：在js中 onclick=fn
第三种：在js中 用el.attachEvent或者el.addEventListener()
三种方式添加的事件处理函数运行的scope是不同的，不同浏览器也不尽相同。
IE
- js: el.onclick = fn ,fn的this->el
- 在div标签中 onclick = "fn()" ,fn的this->window
- js: el.attachEvent('onclick',fn); ,fn的this->window
Firefox、Chrome、Opera
- js: el.onclick = fn ,fn的this->el
- 在标签中 onclick = "fn()" ,fn的this->window (相当于执行eval())
- js: el.addEventListener('onclick',fn); ,fn的this->el
综上总结一下：
如果在函数中使用了this，只有在该函数直接被某对象调用时（代码中肉眼可见的调用,例如a = fn()或者 a.fn() 这种），该this才指向该对象。
this在js中的出场频率还是挺高的，掌握了能识别this到底代表谁，对编程还是很有用的~~加油！！
2015年12月31日 晚6点19分
新年快乐
