this的第一次接触是做一个父容器事件代理的DEMO，当时还不会jquery；
<ul class="ct">
<li>内容1</li>
<li>内容2</li>
<li>内容3</li>
</ul>
var ct=document.querySelector('.ct');
ct.addEventListener('click',function(e){
console.log(e.target.innerText);
});
第一次接触this,感觉这个太厉害了，就是谁调用就是谁；后来遇到这样一个DEMO
function foo(){
console.log(this);
function foo2(){
console.log(this);
}
foo2();
}
foo();
我以为第一个结果是window，第二个结果是foo2，结果控制台的输入狠狠的打脸了!
输出结果
当时我就懵逼了，因为从"元素之力"的世界来，"零一世界"的运作原理还知之甚少，后来经过别人点拨，这个是由于堆栈，是计算机的一个原理；
后来我想想，应该是我在全局环境下调用了foo()，然后window将整个foo()给推入了堆栈，第一个输出为window理所应当，那么foo(2)也是被window给推进堆栈的，"幕后黑手"也是window，这样应该就解释了，这个demo中第二个输出的结果还是window，虽然是函数内部嵌套函数，但this依旧指向了window；
手贱的我又看到了call和apply，这种切换this的手段
var obj1 = {
name:'ran',
fn:function(){
console.log(this);
}
};
obj1.fn();
var fn2 = obj1.fn;
fn2();
fn2.call(obj1);
为什么会这样呢？
- 第一个：obj.fn()是obj去调用fn的，当然第一个是他，这个没有什么异议；
- 第二个陷阱就来了，在全局环境下声明fn2=obj.fn；再去执行fn2，这个时候相当于再全局环境下执行
function(){
console.log(this);
}
一开始，我也犯了迷糊，明明fn在obj之内，怎么又指向全局了，后来我想明白了，这只是一个赋值，让fn2拥有这个函数罢了，相当于obj是一个银行，fn就是100快，现在银行外面的fn2从银行取出一个100快，总不能因为都是100快，就说fn2的钱还是银行的吧；
- 第三个：用call切换了，函数的作用域，打到了切换this的指向，本来fn2的作用域是全局，this是指向window的，结果被call切换到了obj里面，自然把黑锅又给了obj，那么这个this就指向了obj，最后输出也是obj，而不是window；
