关于 this

在 JS 中，this 特指调用函数的那个对象。
如：

  <button>点击</button>
  $('button').on('click',function(){
      console.log(this);//<button>点击</button>
  });

再比如：

$(window).on('scroll',function(){
  console.log(this);//window 对象
})

在上述事件中，比较容易区分 this 特指哪个对象。
但在有些情况下，不容易知道，如：

function foo(){
  console.log(this);
}

下面是具体情况的讲解。

1.作为函数调用时，this 指向全局对象

function foo(){
  console.log(this);
}
foo();//window 对象

再比如

function foo(){
  function fn(){
    console.log(this);
  }
  fn();
}
foo();//window 对象

还比如

function foo(){
  function fn(){
   setTimeout(function(){
      console.log(this)
    },5000);
  }
  fn();
}
foo();//window 对象

这些都是指向 window 对象的。

2.作为对象的方法调用

var obj1 = {
        name: 'Hunter',
        fn: function(){
          console.log(this);
          console.log(this.name);
        }
      };
obj1.fn();//obj1, 可以理解为 obj1 在调用函数 fn... 所以 fn 可以通过 this.name 访问 obj1.name

但是，有些需要注意的点

var obj1 = {
        name: 'Hunter',
        fn: function(){
          console.log(this);
        }
      };
var fn2 = obj1.fn;
fn2();//window 对象。 因为 fn2 = obj1.fn; 相当于 fn2 = function(){console.log(this);} 这样的理解方式与典型的闭包很类似，这只是一个简单的赋值

3.作为构造函数调用

function f(name){
  this.name = name
  console.log(this)
}
var f1 = new f('a');//此时的 this 指向实例 f1 这个对象
var f2 = new f('b');//此时的 this 指向实例 f2 这个对象

this 的指向大概情况就是如此，只要注意是什么情况调用，并不复杂。

另外，可以通过 call 或者 apply 来改变 this。下面进行简单的介绍。

//Function.apply()
function fn(){
  console.log(this)
}
var obj={
  name: 'hunter',
  age: '20'
};
fn.call(obj);//此时的 this 指向 obj

apply 和 call 很类似，只是当函数接受参数时，apply是以数组的方式传递。

function fn(arg1,arg2,arg3,...){
  console.log(this);
  console.log(arg1)
  console.log(arg2)
}
var obj ={
  name: 'hunter'
}
fn.call(obj,1,2,3)
fn.apply(obj,[1,2,3])