javascript實(shí)現(xiàn)方法調(diào)用與方法觸發(fā)小結(jié)
在js中，this關(guān)鍵字是一個(gè)比較讓人有意思的東西，但是它的指向經(jīng)常讓初學(xué)者摸不著頭腦。
其實(shí)要理解這個(gè)關(guān)鍵字，需要理清兩個(gè)問(wèn)題——“方法的調(diào)用和方法的觸發(fā)”
下面先看一段代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>function</title>
<script>
function showThis(){
console.info(this);
}
function Test1(){
this.f=showThis;
}
function Test2(){
this.f=function(){
showThis();
}
}
showThis();//window
new Test1().f();//Test1
new Test2().f();//window
</script>
</head>
<body>
</body>
</html>
20行打印出window對(duì)象，這個(gè)很容易理解，但是21行打印出Test1的實(shí)例對(duì)象，而22行卻打印出window對(duì)象。查看Test1和Test2的構(gòu)造，發(fā)現(xiàn)方法f最終都執(zhí)行了showThis方法。但是showThis中的this指向卻不同。這是因?yàn)門(mén)est1中的f方法直接指向showThis，new Test1().f()是以Test1 的實(shí)例直接調(diào)用showThis方法，調(diào)用者是Test1的實(shí)例。而new Test2().f()是在Test2的實(shí)例方法f中觸發(fā)window對(duì)象的showThis方法，其中的this就是指向其調(diào)用者window而不是觸發(fā)者Test2的實(shí)例。
至此可以發(fā)現(xiàn)。this指向的是調(diào)用者，而觸發(fā)者只是推進(jìn)調(diào)用者執(zhí)行指定方法而已。
相關(guān)文章
本篇主要給廣大JS程序員介紹了怎么能讓自己寫(xiě)的JS代碼好看易讀，分析了幾個(gè)需要注意的地方和方法，一起來(lái)學(xué)習(xí)下。2017-12-12
JavaScript進(jìn)階教程(第四課第一部分)...2007-04-04
javascript的面向?qū)ο缶幊桃黄饋?lái)看看
這篇文章主要為大家詳細(xì)介紹了javascript的面向?qū)ο缶幊蹋闹惺纠a介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助2022-02-02
簡(jiǎn)介JavaScript中的sub()方法的使用
這篇文章主要介紹了JavaScript中的sub()方法的使用,是JS入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-06-06
這篇文章主要介紹了JavaScript中for循環(huán)的使用詳解,是JS入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-06-06
location.href在使用中很是頻繁，接下來(lái)為大家詳細(xì)介紹下location.href主要的使用方法有哪些，感興趣的朋友可以參考下2013-12-12
JavaScript DOM學(xué)習(xí)第四章 getElementByTagNames
HTML有一些相關(guān)有不同tag名字的相關(guān)元素，比如H1-H6或者input，select和TEXTAREA。getElementByTagName只能取得那些有相同tag名稱(chēng)的元素，所以你不能用他來(lái)取得所有的標(biāo)題或者整個(gè)表單內(nèi)容。2010-02-02
2019年度web前端面試題總結(jié)(主要為Vue面試題)
轉(zhuǎn)眼2019又要過(guò)去了，作為一名前端碼農(nóng)，又熬過(guò)一個(gè)沒(méi)日沒(méi)夜的年頭，頭發(fā)又少了不少，去年的學(xué)習(xí)計(jì)劃一半也沒(méi)完成，唉。。。 現(xiàn)在為大家總結(jié)一下這一年面試的幾家公司的關(guān)于前端面試題吧2020-01-01
這篇文章主要介紹了forward和redirect的區(qū)別,在前端開(kāi)發(fā)中,有很多剛?cè)胄械呐笥巡涣私膺@兩者之間的區(qū)別,那么這篇文章可以帶給你新的認(rèn)知,需要的朋友可以參考下2023-03-03
簡(jiǎn)介JavaScript中fixed()方法的使用
這篇文章主要介紹了JavaScript中fixed()方法的使用,是JS入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-06-06