js的this指標

標籤：http   java   art   javascript   cti   表   

因為發現身邊的一些朋友對js的this指標的理解不是很全面。下面本人簡單的講解一下js的this指標的相關內容，僅供需要的朋友學習參考。

簡單的，我先用一句話來概括javascript的this。在js裡面，this指標代表的是執行當前代碼的對象的所有者。

下面舉幾個簡單的例子加以說明：

 

Js的this指標一代碼  

1. var name="jonson";  
2. function test(){alert("您好，我的名字叫"+this.name);}  
3. test();  

  這段代碼很簡單，我們定義了一個全域變數name，一個全域的function，最後調用了這個test方法。運行這段代碼，會彈出"您好，我的名字叫jonson"。

這裡的test方法以及name方法都屬於js的最初始的對象window的。簡單的說：下面調用test方法的對象就是window。

 

Js的this執行個體2代碼  

1. var obj={};  
2. var name="jonson_window";  
3. obj.name="jonson_obj";  
4. obj.test=function (){alert("您好，我的名字是"+this.name)};  
5. obj.test();  

  運行這段代碼，頁面彈出"您好，我的名字是jonson_obj"，而不是"您好，我的名字是jonson_wondow"。因為最後一句obj.test(),指的是obj對象調用test方法，所以這裡的

this.name指的自然就是obj.name的值。

 

Js的this執行個體4代碼  

1. function test(){        
2. alert(this.title);  
3. }  
4. <input  type="button" value="test" onclick="test()" id="test" title="test">  

  運行這段字碼頁面彈出undefined字樣。有人會說，我的input標籤裡面明明有title屬性的值為test的。但是這裡為什麼會彈出undefined字樣呢。其實道理很簡單，這裡是通過onclick方法調用的。其實onclick="test()"，相當於function onclick(evenet){test();},而function onclick其實也是一個全域的function，上面的 test方法也是全域的function，都可以視為window對象的兩個屬性。這裡其實就是通過這個在onclick方法裡面調用這個test方法，其實這裡和第一種說法是一樣的。

 

通過以上的幾個例子，我相信大家都多少理解了js的this指代含義------this指標代表的是執行當前代碼的對象的所有者。