你必須知道的Javascript知識點之"this指針"的應(yīng)用
更新時間:2013年04月23日 09:47:32 作者:
本篇文章小編為大家介紹,你必須知道的Javascript知識點之"this指針"的應(yīng)用。需要的朋友參考下
很多人都知道this指針,這篇文章的主要目的是為了培訓(xùn)我們公司的新人。
默認(rèn)的this指針指向
規(guī)則1
this指針默認(rèn)指向方法調(diào)用時為其指定的對象,如:obj.fun(),fun方法體中的this指針指向obj。
復(fù)制代碼 代碼如下:
var user = { name: '段光偉' };
user.getName = function(){ return this.name; };
user.getName(); //返回‘段光偉'
復(fù)制代碼 代碼如下:
var user = { name: '段光偉' };
user.getName = function(){ return this.name; };
user.getName(); //返回‘段光偉'
window.name = '李妞妞';
window.getName = user.getName
window.getName(); //返回‘李妞妞'
getName(); //返回‘李妞妞'
規(guī)則2
如果在方法調(diào)用時沒有為方法指定對象則this指針默認(rèn)指向window,如:fun(),fun方法體中的this指針指向window。
復(fù)制代碼 代碼如下:
var fun = function(){
return this;
}
fun(); //返回window對象
規(guī)則3沒有在方法體中的代碼可以看作執(zhí)行在一個匿名方法,根據(jù)規(guī)則2可以推論出其this指針指向window。
this //window對象
改變this指針的默認(rèn)指向
使用apply
復(fù)制代碼 代碼如下:
var user = { name: '段光偉' };
user.hi= function(message){ return this.name+':'+message; };
window.name = '李妞妞'
user.hi('你好'); //輸出‘段光偉:你好'
user.hi.apply(window, ['你好']); //輸出‘李妞妞:你好'
使用call
復(fù)制代碼 代碼如下:
var user = { name: '段光偉' };
user.hi= function(message){ return this.name+':'+message; };
window.name = '李妞妞'
user.hi('你好'); //輸出‘段光偉:你好'
user.hi.call(window, '你好'); //輸出‘李妞妞:你好'
構(gòu)造函數(shù)中的this指向
構(gòu)造函數(shù)中的this指針默認(rèn)指向執(zhí)行正在構(gòu)造的對象。
復(fù)制代碼 代碼如下:
var User = function(name){
this.name = name;
};
User.prototype.hi = function(){
return this.name;
};
var user = new User('段光偉');
user.hi(); //輸出‘段光偉'
最后的小測試
猜猜最后的輸出時什么?
復(fù)制代碼 代碼如下:
var User = function(name){
this.name = name;
};
User.prototype.hi = function(){
return this.name;
};
var user = new User('段光偉');
user.hi(); //輸出‘段光偉'
var hi = user.hi;
hi(); //猜猜這里的輸出
相關(guān)文章
原生js實現(xiàn)shift/ctrl/alt按鍵的獲取
小測試shift、ctrl、alt按鍵的獲取,感興趣的朋友可以參考下哈,希望可以幫助到你2013-04-04
js編寫當(dāng)天簡單日歷效果【實現(xiàn)代碼】
下面小編就為大家?guī)硪黄猨s編寫當(dāng)天簡單日歷效果【實現(xiàn)代碼】。小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考2016-05-05
一文教你用javascript實現(xiàn)條形碼和二維碼
這篇文章主要為大家介紹了如何用javascript實現(xiàn)條形碼和二維碼示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-07-07
JavaScript必知必會(十) call apply bind的用法說明
這篇文章主要介紹了JavaScript必知必會(十) call apply bind的用法說明 的相關(guān)資料,非常不錯具有參考借鑒價值,需要的朋友可以參考下2016-06-06

