JavaScript this關(guān)鍵字指向常用情況解析
在之前寫代碼的經(jīng)歷中,常常試過(guò)寫著寫著this就莫名其妙的不知道指向到哪里去了。今天看了曾探的javascript設(shè)計(jì)模式,里面特別談到了this在不同情況下指代的對(duì)象,非常有意思。
this指代的情況
this有以下4種情況:
1、對(duì)象.函數(shù)的形式調(diào)用:object.function();
2、普通函數(shù)的形式調(diào)用:function();
3、構(gòu)造器調(diào)用;
4、Function.prototype.call或Function.prototype.apply調(diào)用;
1、對(duì)象.函數(shù)的形式調(diào)用
對(duì)象.函數(shù)方式調(diào)用時(shí),指代該對(duì)象。
var obj = { num:1, getNum:function(){ alert(this.num);//輸出1 } } obj.getNum();
2、普通函數(shù)形式調(diào)用
普通函數(shù)的方式被調(diào)用時(shí),this指向全局對(duì)象。
window.num = 2; var obj = { num:1, getNum:function(){ alert(this.num); } } obj.getNum();//彈出1 var fun1 = obj.getNum; fun1(); //彈出2
太神奇了,直接調(diào)用函數(shù) fun(); 與通過(guò)對(duì)象調(diào)用函數(shù) xxx.fun(); this指代的對(duì)象不同。
3、構(gòu)造器調(diào)用
為了能夠用上new關(guān)鍵字,javascript的創(chuàng)建對(duì)象可以這樣定義。
var person = function(){
this.name = '劉備';
}
在這種情況下,this指代這個(gè)正在創(chuàng)建中的對(duì)象。
var p = new person();
alert(p.name);//彈出劉備
4、Function.prototype.call或Function.prototype.apply調(diào)用
var obj1 = { name:'關(guān)羽', getName:function(){ return this.name; } } var obj2 = { name:'劉備' } alert(obj1.getName()); //關(guān)羽 alert(obj1.getName.call(obj2)); //劉備
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
簡(jiǎn)單實(shí)用的HTML到UBB轉(zhuǎn)換腳本工具實(shí)現(xiàn)說(shuō)明
你也許是位樂(lè)于分享的技術(shù)人員,盡管你算不上什么技術(shù)高手,但是你都希望把自己所知道的通過(guò)博客與網(wǎng)友分享。為了讓更多人知道你的經(jīng)驗(yàn),你可能會(huì)努力把博文發(fā)布到專業(yè)論壇。2009-11-11JS+CSS實(shí)現(xiàn)的藍(lán)色table選項(xiàng)卡效果
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)的藍(lán)色table選項(xiàng)卡效果,通過(guò)鼠標(biāo)事件調(diào)用自定義函數(shù)實(shí)現(xiàn)頁(yè)面元素樣式的遍歷與動(dòng)態(tài)切換效果,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10fastclick插件導(dǎo)致日期(input[type="date"])控件無(wú)法被觸發(fā)該如何解決
這篇文章主要介紹了fastclick插件導(dǎo)致日期(input[type="date"])控件無(wú)法被觸發(fā)該如何解決,需要的朋友可以參考下2015-11-11微信小程序image圖片加載完成監(jiān)聽(tīng)
這篇文章主要為大家詳細(xì)介紹了微信小程序image圖片加載完成監(jiān)聽(tīng),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-08-08簡(jiǎn)單介紹JavaScript數(shù)據(jù)類型之隱式類型轉(zhuǎn)換
這篇文章主要介紹了簡(jiǎn)單介紹JavaScript數(shù)據(jù)類型之隱式類型轉(zhuǎn)換的相關(guān)資料,需要的朋友可以參考下2015-12-12TypeScript模塊與命名空間的關(guān)系和使用方法
在TypeScript中就像在EC5中一樣,任何包含頂級(jí)import或export的文件都被認(rèn)為是一個(gè)模塊,下面這篇文章主要給大家介紹了關(guān)于如何在TypeScript使用模塊與命名空間以及注意事項(xiàng)的相關(guān)資料,需要的朋友可以參考下2023-03-03史上最全JavaScript常用的簡(jiǎn)寫技巧(推薦)
這篇文章主要介紹了JavaScript常用的簡(jiǎn)寫技巧,列舉了20條js中常用的簡(jiǎn)寫技巧,具體操作步驟大家可查看下文的詳細(xì)講解,感興趣的小伙伴們可以參考一下2017-08-08