本文小編為大家詳細(xì)介紹“javascript中this的含義是什么”,內(nèi)容詳細(xì),步驟清晰,細(xì)節(jié)處理妥當(dāng),希望這篇“javascript中this的含義是什么”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學(xué)習(xí)新知識(shí)吧。
創(chuàng)新互聯(lián)公司是一家集網(wǎng)站建設(shè),團(tuán)風(fēng)企業(yè)網(wǎng)站建設(shè),團(tuán)風(fēng)品牌網(wǎng)站建設(shè),網(wǎng)站定制,團(tuán)風(fēng)網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,團(tuán)風(fēng)網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè),幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力??沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿,時(shí)刻以成就客戶成長自我,堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己,讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。
this的中文意思為“當(dāng)前;這個(gè)”,是javascript中的一個(gè)指針型變量,它指向當(dāng)前函數(shù)的運(yùn)行環(huán)境。在不同的場(chǎng)景中調(diào)用同一個(gè)函數(shù),this的指向會(huì)發(fā)生變化,但它永遠(yuǎn)指向其所在函數(shù)的真實(shí)調(diào)用者;如果沒有調(diào)用者,this就指向window。
本教程操作環(huán)境:windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。
JavaScript 函數(shù)的作用域是靜態(tài)的,但是函數(shù)的調(diào)用卻是動(dòng)態(tài)的。由于函數(shù)可以在不同的運(yùn)行環(huán)境內(nèi)執(zhí)行,因此 JavaScript 在函數(shù)體內(nèi)定義了 this 關(guān)鍵字,用來獲取當(dāng)前的運(yùn)行環(huán)境。
this 是一個(gè)指針型變量,它指向當(dāng)前函數(shù)的運(yùn)行環(huán)境。
在不同的場(chǎng)景中調(diào)用同一個(gè)函數(shù),this的指向也可能會(huì)發(fā)生變化,但是它永遠(yuǎn)指向其所在函數(shù)的真實(shí)調(diào)用者(誰調(diào)用就指向誰);如果沒有調(diào)用者,this就指向全局對(duì)象window。
this 是由 JavaScript 引擎在執(zhí)行函數(shù)時(shí)自動(dòng)生成的,存在于函數(shù)內(nèi)的一個(gè)動(dòng)態(tài)指針,指代當(dāng)前調(diào)用對(duì)象。具體用法如下:
this[.屬性]
如果 this 未包含屬性,則傳遞的是當(dāng)前對(duì)象。
this 用法靈活,其包含的值也是變化多端。例如,下面示例使用 call() 方法不斷改變函數(shù)內(nèi) this 指代對(duì)象。
var x = "window"; //定義全局變量x,初始化字符串為“window” function a () { //定義構(gòu)造函數(shù)a this.x = "a"; //定義私有屬性x,初始化字符a } function b () { //定義構(gòu)造函數(shù)b this.x = "b"; //定義私有屬性x,初始化為字符b } function c () { //定義普通函數(shù),提示變量x的值 console.log(x); } function f () { //定義普通函數(shù),提示this包含的x的值 console.log(this.x); } f(); //返回字符串“window”,this指向window對(duì)象 f.call(window); //返回字符串“window”,指向window對(duì)象 f.call(new a()); //返回字符a,this指向函數(shù)a的實(shí)例 f.call(new b()); //返回字符b,this指向函數(shù)b的實(shí)例 f.call(c); //返回undefined,this指向函數(shù)c對(duì)象
下面簡(jiǎn)單總結(jié) this 在 5 種常用場(chǎng)景中的表現(xiàn)以及應(yīng)對(duì)策略。
1. 普通調(diào)用
下面示例演示了函數(shù)引用和函數(shù)調(diào)用對(duì) this 的影響。
var obj = { //父對(duì)象 name : "父對(duì)象obj", func : function () { return this; } } obj.sub_obj = { //子對(duì)象 name : "子對(duì)象sub_obj", func : obj.func } var who = obj.sub_obj.func(); console.log(who.name); //返回“子對(duì)象sub_obj”,說明this代表sub_obj
如果把子對(duì)象 sub_obj 的 func 改為函數(shù)調(diào)用。
obj.sub_obj = { name : "子對(duì)象sub_obj", func : obj.func() //調(diào)用父對(duì)象obj的方法func }
則函數(shù)中的 this 所代表的是定義函數(shù)時(shí)所在的父對(duì)象 obj。
var who = obj.sub_obj.func; console.log(who.name); //返回“父對(duì)象obj”,說明this代表父對(duì)象obj
2. 實(shí)例化
使用 new 命令調(diào)用函數(shù)時(shí),this 總是指代實(shí)例對(duì)象。
var obj = {}; obj.func = function () { if (this == obj) console.log("this = obj"); else if (this == window) console.log("this = window"); else if (this.contructor == arguments.callee) console.log("this = 實(shí)例對(duì)象"); } new obj.func; //實(shí)例化
3. 動(dòng)態(tài)調(diào)用
使用 call 和 apply 可以強(qiáng)制改變 this,使其指向參數(shù)對(duì)象。
function func () { //如果this的構(gòu)造函數(shù)等于當(dāng)前函數(shù),則表示this為實(shí)例對(duì)象 if (this.contructor == arguments.callee) console.log("this = 實(shí)例對(duì)象"); //如果this等于window,則表示this為window對(duì)象 else if (this == window) console.log("this = window對(duì)象"); //如果this為其他對(duì)象,則表示this為其他對(duì)象 else console.log("this == 其他對(duì)象 \n this.constructor =" + this.constructor); } func(); //this指向window對(duì)象 new func(); //this指向?qū)嵗龑?duì)象 cunc.call(1); //this指向數(shù)值對(duì)象
在上面示例中,直接調(diào)用 func() 時(shí),this 代表 window 對(duì)象。當(dāng)使用 new 命令調(diào)用函數(shù)時(shí),將創(chuàng)建一個(gè)新的實(shí)例對(duì)象,this 就指向這個(gè)新創(chuàng)建的實(shí)例對(duì)象。
使用 call() 方法執(zhí)行函數(shù) func() 時(shí),由于 call() 方法的參數(shù)值為數(shù)字 1,則 JavaScript 引擎會(huì)把數(shù)字 1 強(qiáng)制封裝為數(shù)值對(duì)象,此時(shí) this 就會(huì)指向這個(gè)數(shù)值對(duì)象。
4. 事件處理
在事件處理函數(shù)匯總,this 總是指向觸發(fā)該事件的對(duì)象。
<input type="button" value="測(cè)試按鈕" /> <script> var button = document.getElementsByTagName("put")[0]; var obj = {}; obj.func = function () { if (this == obj) console.log("this = obj"); if (this == window) console.log("this = window"); if (this == button) console.log("this = button"); } button.onclick = obj.func; </script>
在上面代碼中,func() 所包含的 this 不再指向?qū)ο?obj,而是指向按鈕 button,因?yàn)?func() 是被傳遞給按鈕的事件處理函數(shù)之后才被調(diào)用執(zhí)行的。
如果使用 DOM2 級(jí)標(biāo)準(zhǔn)注冊(cè)事件處理函數(shù),程序如下:
if (window.attachEvent) { //兼容IE模型 button.attachEvent("onclick", obj.func); } else { //兼容DOM標(biāo)準(zhǔn)模型 button.addEventListener("click", obj.func, true); }
在 IE 瀏覽器中,this 指向 window 對(duì)象和 button 對(duì)象,而在 DOM 標(biāo)準(zhǔn)的瀏覽器中僅指向 button 對(duì)象。因?yàn)?,?IE 瀏覽器中,attachEvent() 是 window 對(duì)象的方法,調(diào)用該方法時(shí),this 會(huì)指向 window 對(duì)象。
為了解決瀏覽器兼容性問題,可以調(diào)用 call() 或 apply() 方法強(qiáng)制在對(duì)象 obj 身上執(zhí)行方法 func(),避免出現(xiàn)不同的瀏覽器對(duì) this 解析不同的問題。
if (window.attachEvent) { button.attachEvent("onclick", function () { //用閉包封裝call()方法強(qiáng)制執(zhí)行func() obj.func.call(obj); }); } else { button.attachEventListener("onclick", function () { obj.func.call(obj); }, true); }
當(dāng)再次執(zhí)行時(shí),func() 中包含的 this 始終指向?qū)ο?obj。
5. 定時(shí)器
使用定時(shí)器調(diào)用函數(shù)。
var obj = {}; obj.func = function () { if (this == obj) console.log("this = obj"); else if (this == window) console.log("this = window對(duì)象"); else if (this.constructor == arguments.callee) console.log("this = 實(shí)例對(duì)象"); else console.log("this == 其他對(duì)象 \n this.constructor =" + this.constructor); } setTimeOut(obj.func, 100);
在 IE 中 this 指向 window 對(duì)象和 button 對(duì)象,具體原因與上面講解的 attachEvent() 方法相同。在符合 DOM 標(biāo)準(zhǔn)的瀏覽器中,this 指向 window 對(duì)象,而不是 button 對(duì)象。
因?yàn)榉椒?setTimeOut() 是在全局作用域中被執(zhí)行的,所以 this 指向 window 對(duì)象。要解決瀏覽器兼容性問題,可以使用 call 或 apply 方法來實(shí)現(xiàn)。
setTimeOut (function () { obj.func.call(obj); }, 100);
讀到這里,這篇“javascript中this的含義是什么”文章已經(jīng)介紹完畢,想要掌握這篇文章的知識(shí)點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過才能領(lǐng)會(huì),如果想了解更多相關(guān)內(nèi)容的文章,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
分享文章:javascript中this的含義是什么
網(wǎng)站鏈接:http://muchs.cn/article38/pipgpp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供域名注冊(cè)、商城網(wǎng)站、營銷型網(wǎng)站建設(shè)、小程序開發(fā)、關(guān)鍵詞優(yōu)化、網(wǎng)站導(dǎo)航
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)