javascript this關鍵字指向詳解

在以前寫代碼的經歷中，經常試過寫着寫着this就莫名其妙的不知道指向到哪裏去了。今天看了曾探的javascript設計模式，裏面特別談到了this在不一樣狀況下指代的對象，很是有意思。

this指代的狀況

---

this有如下4種狀況：

一、對象.函數的形式調用：object.function();

二、普通函數的形式調用：function();

三、構造器調用;

四、Function.prototype.call或Function.prototype.apply調用;

一、對象.函數的形式調用

---

對象.函數方式調用時，指代該對象。

1 2 3 4 5 6 7

var  obj = {      num:1,      getNum: function (){          alert( this .num); //輸出1      } } obj.getNum();

二、普通函數形式調用

---

普通函數的方式被調用時，this指向全局對象。

1 2 3 4 5 6 7 8 9 10

window.num = 2; var  obj = {      num:1,      getNum: function (){          alert( this .num);      } } obj.getNum(); //彈出1 var  fun1 = obj.getNum; fun1();     //彈出2

太神奇了，直接調用函數 fun(); 與經過對象調用函數 xxx.fun(); this指代的對象不一樣。

三、構造器調用

---

爲了可以用上new關鍵字，javascript的建立對象能夠這樣定義。

1 2 3

var  person =  function (){      this .name =  '劉備' ; }

在這種狀況下，this指代這個正在建立中的對象。

1 2	var  p =  new  person(); alert(p.name); //彈出劉備

四、Function.prototype.call或Function.prototype.apply調用

---

1 2 3 4 5 6 7 8 9 10 11

var  obj1 = {      name: '關羽' ,      getName: function (){          return  this .name;      } } var  obj2 = {      name: '劉備' } alert(obj1.getName());     //關羽 alert(obj1.getName.call(obj2));     //劉備

來源：  javascript this關鍵字