JS的一道this例題解析

2021-09-05 12:21:09 字數 1705 閱讀 5947

在學習js裡this的指向時,發現了一道有點**的面試題,看懂了對學習this應該是挺有幫助的

例題如下

function parent() ;

this.show = function ()

}function child()

}child.prototype = new parent();

var parent = new parent();

var child1 = new child();

var child2 = new child();

child1.a = 11;

child2.a = 12;

child1.show();

child2.show();

parent.show();

child1.change();

child1.show();

child2.change();

child2.show();

parent.show();

答案如下:

child1.show();//11 [1,2,1] 5

child2.show();//12 [1,2,1] 5

parent.show();//1 [1,2,1] 5

child1.change();

child1.show();//5 [1,2,1,11] 4

child2.change();

child2.show();//6 [1,2,1,11,12] 5

parent.show();//1 [1,2,1] 5

以下是我的理解

第一塊沒有使用change時,比較好理解,child繼承了parent,所以可以使用show方法。首先輸出show裡面的this.a,由於此時呼叫者還是child,所以在child找到a=11。隨後是show裡的this.b,先查詢child裡面沒有,就查詢原型物件parent物件,然後輸出裡面的b,在b裡面的this.a時,由於呼叫者現在是parent,所以this.a引用的也是parent裡面的a。然後是this.c.demo,同樣查到parent裡面輸出5。

第二塊child1呼叫了change方法,這個地方的難點是this.b.push(this.a),push進去的依然是chid裡面的a而不是parent裡的a。因為這次的this.a所處的上下文是child,首先會在child裡面查詢,如果沒有才會去原型裡找。而前面this.a是已經在原型裡面的環境,自然就只能查詢原型了,如果原形parent裡沒有a,那就輸出undefined。

第三塊的難點在於,第二塊的改動繼續被沿用了,對child2例項也產生了改動。因為他們原型裡指向的物件parent是同乙個物件。parent在child.prototype = new parent()這個時候已經新建了例項物件並繫結在了child上面作為它的原型物件,child新建例項的時候並不會影響原型物件,因為就算child不建立例項,我們一樣可以通過child.prototype操作賦進去的parent物件

第四塊沒有難點,前面改動的僅僅是它的乙個例項,而parent本身沒有受到影響

這個地方涉及的不僅僅是this的指向問題,還有一些繼承或原型的知識,我的理解也不是很全面,可能在以後學的更透徹的時候會有不一樣的想法

一道題解析物件導向的特徵

public class testdt class a public string run a obj class bextends a public string run a obj class cextends b class dextends b關於上面所有注釋答案的解釋其實就乙個核心秘笈,多...

一道基礎例題的思考

上面是一段我自己編寫的 具體問題是寫出console.log的值,其中我的下意識的判斷 console.log a.constructor b true理由是b.prototype.contructor重寫了a.prototype物件contructor屬性,執行以上 執行結果證明我的下意思判斷是錯...

一道例題解決記憶化搜尋(若干疑問)

附上 include using namespace std int n,m int f 1001 1001 int f1 1001 1001 int vis 1001 1001 int dfs int x,int y for i 0 i第一點 f1 x y max f1 x y b 這是把值儲存起...