this

随着函数场合的不同，this的值会发生变化，但是this总是指向调用函数的那个对象
（1）作为函数调用（谁调用，this就指向谁）

  console.log(this);//Window
   function fn() {
      console.log(this)
 }
fn()//Window;函数被直接调用时，this绑定到全局对象

function fn1() {
    function fn2() {
       console.log(this)
   }
 }
 fn2()//Window;

（2）setTimeout、setInterval：这两个方法执行的this也是全局对象
（3）作为构造函数：所谓构造函数，就是通过这个函数生成一个新对象（object）。这时，this就指这个新对象

  function Person(name,sex) {
          this.name=name;
          this.sex=sex;
  }
  Person.prototype.saySex=function() {
     console.log(this.sex)
}
var p1=new Person('小明','男')；
 p1.saySex();//男 

（4）作为对象方法调用：在 JavaScript 中，函数也是对象，因此函数可以作为一个对象的属性，此时该函数被称为该对象的方法，在使用这种调用方式时，this 被自然绑定到该对象

    var obj1 = {
      name: 'Byron',
      fn : function(){
      console.log(this);
    }
 };

obj1.fn();

（5）DOM对象绑定事件：在事件处理程序中this
代表事件源DOM对象

练习题

（1）以下代码输出什么？

     var john = { 
          firstName: "John" 
     }
    function func() { 
        alert(this.firstName + ": hi!")
   }
   john.sayHi = func
  john.sayHi() 
 输出结果为John:hi;sayHi()作为一个对象的属性，绑定在对象john上，此时的this指向绑定的对象所以输出结果为john:hi;

（2）以下代码输出什么

        func() 

       function func() { 
         alert(this)
     }
        输出结果为window.因为此时执行func()的环境window。所  以输出结果为window

（3）以下代码输出什么

       function fn0(){
           function fn(){
          console.log(this);
        }
      fn();
    }

 fn0();//输出window，函数嵌套产生的内部函数的this不是其父函数，仍然是全局变量，因为执行环境仍然是window.



document.addEventListener('click', function(e){
console.log(this);//输出document，在事件处理程序中this代表事件源DOM对象
setTimeout(function(){
console.log(this);//输出window，setTimeout、setInterval这两个方法执行的函数this指向全局变量window。
}, 200);
}, false);

4.以下代码输出什么

   var john = { 
     firstName: "John" 
   }

    function func() { 
      alert( this.firstName )
    }
    func.call(john) //call把函数中的this指向了john对象

5.以下代码输出什么

var john = { 
firstName: "John",
surname: "Smith"
}

  function func(a, b) { 
alert( this[a] + ' ' + this[b] )
 }
  func.call(john, 'firstName', 'surname') //弹出John Smith,首先call将函数中的this指向了john对象，然后传入了两个参数。

6.以下代码有什么问题，如何修改

    var module= {
        bind: function(){
        $btn.on('click', function(){
        console.log(this) //this指向$btn
        me.showMsg();
         })
      },

     showMsg: function(){
    console.log('饥人谷');
    }
}
修改方法：
  var module= {
   bind: function(){
   var me=this;//this指向module,把this给保存下来
  $btn.on('click', function(){
    console.log(this) //this指向$btn
    this.showMsg();
    })
    },

showMsg: function(){
  console.log('饥人谷');
  }
 }