詳解JavaScript原型對象的this指向問題
一、this指向
構(gòu)造函數(shù)中的this 指向?qū)嵗龑ο蟆D敲丛蛯ο髏his的指向呢?
如下:
function Student(age,name){ this.age = age; this.name = name; } var that; Student.prototype.score = function(){ console.log('孩子們成績都很好!'); that = this; } var xl = new Student(18,'小熊'); xl.score(); console.log(that === xl);
定義一個全局變量that,在score函數(shù)里面給它賦值,讓其指向函數(shù)里面的this,調(diào)用實例對象的score方法,判斷that和實例對象是否一致,如果一致,則說明原型對象this的指向是該實例。
打印結(jié)果為:
即原型對象里面放的是方法, 這個方法里面的this 指向的是 這個方法的調(diào)用者, 也就是這個實例對象。
二、修改this指向
1、call()方法
寫一個簡單的兩數(shù)相加的函數(shù)。
function fn(a,b){ console.log(a+b); console.log(this); } fn(1,2)
在函數(shù)內(nèi)部打印this,調(diào)用函數(shù),看其this的指向。
可知this指向window對象,如果我們想讓this指向我們新創(chuàng)建的一個對象,怎么操作呢?
先定義一個對象,
o = {};
然后通過call()修改this指向,讓其指向新創(chuàng)建的對象o
o = { name: 'xl' }; fn.call(o,1,2);
打印結(jié)果為:
現(xiàn)在this指向新創(chuàng)建的對象o,即修改成功。
2、apply()方法
apply()和call()方法基本相同,這里就不贅述,直接上代碼:
function fn(a,b){ console.log(a+b); console.log(this); } o = { name: 'xl' }; fn.apply(o,[1,2]);
可以發(fā)現(xiàn),這兩種方法還是有區(qū)別的,即:call()接受的參數(shù)必須是連續(xù)參數(shù),而apply()方法接收參數(shù)的形式是數(shù)組參數(shù)。
總結(jié)
本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
Highslide.js是一款基于js實現(xiàn)的網(wǎng)頁中圖片展示插件
這篇文章主要介紹了Highslide.js是一款基于js實現(xiàn)的網(wǎng)頁中圖片預(yù)覽查看工具,需要的朋友可以參考下2007-05-05跟我學(xué)習(xí)javascript的this關(guān)鍵字
跟我學(xué)習(xí)javascript的this關(guān)鍵字,this是動態(tài)綁定,或稱為運行期綁定的,這就導(dǎo)致 JavaScript中的this關(guān)鍵字有能力具備多重含義,帶來靈活性的同時,也為初學(xué)者帶來不少困惑2015-11-11JavaScript彈簧振子超簡潔版 完全符合能量守恒,胡克定理
完全符合能量守恒,胡克定理的JavaScript彈簧振子(超簡潔版,超越第一版!)2009-10-10精解window.setTimeout()&window.setInterval()使用方式與參數(shù)傳遞問題!
精解window.setTimeout()&window.setInterval()使用方式與參數(shù)傳遞問題!...2007-11-11JavaScript結(jié)合Canvas繪畫畫運動小球
這篇文章主要介紹了JavaScript結(jié)合Canvas畫運動小球,canvas被稱為畫布,可以結(jié)合javascript實現(xiàn)繪制各種圖形,制作各種炫酷的動畫效果,下面文章更多詳細內(nèi)容介紹需要的小伙伴可以參考一下2022-03-03