JavaScript中的this使用详解

其实this是一个老生常谈的问题了。关于this的文章非常多，其实我本以为自己早弄明白了它，不过昨天在做项目的过程中，还是出现了一丝疑惑，想到大概之前在JavaScript weekly里收藏待看的一篇详解this的文章（后有链接，也附上了稀土上的中文译文）和另一篇一位前辈推荐的文章，就把它们看了看，对this的认识确实提升了一些。

JavaScript 中的'this‘是动态的，它在函数运行时被确定而非在函数声明时被确定。所有的函数都可以调用'this'，这无关于该函数是否属于某个对象。关于this，主要有以下四种情况。

1.被当做对象的方法被调用

如果该函数是被当做某一个对象的方法，那么该函数的this指向该对象；

  var john = {   firstName: "John"  }  function func() {   alert(this.firstName + ": hi!")  }  john.sayHi = func  john.sayHi() // this = john

这里有一点值得注意，当一个对象的方法被取出来赋值给一个变量时，该方法变为函数触发，this指向window或underfind（严格模式）。

2.函数之内调用

当函数中有 this，其实就意味着它被当做方法调用，之间调用相当于把他当做window对象的方法，this指向window，值得注意的是ES5其实是规定这种情况this=undefined的，只浏览器大多还是按照老的方法执行(本人在最新版的Chrome，Safari，Firefox中测试都指向window（201607）),在火狐下使用严格模式指向undefined；

  func()  function func() {    alert(this) // [object Window] or [object global] or kind of..  }

为了传递this，()之前应该为引用类型，类似于obj.a 或者 obj['a'],不能是别的了。

这里还存在一个小坑，当对象的方法中还存在函数时，该函数其实是当做函数模式触发，所以其this默认为window（严格模式下为undefined）解决办法是给该函数绑定this。

var numbers = {   numberA: 5,  numberB: 10,  sum: function() {   console.log(this === numbers); // => true   function calculate() {    // this is window or undefined in strict mode    console.log(this === numbers); // => false    return this.numberA + this.numberB;   }   return calculate();  }};numbers.sum(); // => NaN or throws TypeError in strict mode var numbers = {   numberA: 5,  numberB: 10,  sum: function() {   console.log(this === numbers); // => true   function calculate() {    console.log(this === numbers); // => true    return this.numberA + this.numberB;   }   // use .call() method to modify the context   return calculate.call(this);  }};numbers.sum(); // => 15 

3.在new中调用

一个引用对象的变量实际上保存了对该对象的引用，也就是说变量实际保存的是对真实数据的一个指针。
使用new关键字时this的改变其实有以下几步：