function People() {
}
People.prototype.say = function () {
alert("hello");
}
function Student() {
}
Student.prototype = new People();
var superSay = Student.prototype.say;
Student.prototype.say = function () {
superSay.call(this); // 为什么会是"hello"?
alert("stu-hello");
}
var s = new Student();
s.say();
superSay.call(this)
為什麼會是People.prototype.say
函數被呼叫? this
指向誰?
this指向
Student{}
類,這個你可以在superSay.call(this)
上面加一行console.log(this)
進行驗證。然後,我們看這個程式碼
為了方便後面解釋,我把這裡的
new People()
創建的實例稱為實例X
。由於
superSay = Student.prototype.say
,因為上面的Student.prototype = new People();
,所以其中Student.prototype
為實例X
。所以實際上
superSay
調用的是實例X
的say
,而並非People.prototype.say
。至於你為啥覺得是在呼叫
People.prototype.say
,主要還是原型鏈的問題。實例X
是People類別的實例,所以實例X
的所有方法會從People類別的原型鏈中「繼承」(用繼承這個詞,但是實際上JS的原型鍊和繼承還是有些區別的)。所以實例X.say
如果沒有針對實例X
重寫say
方法,那麼實例X
的say
就和People.prototype.say
等值。另外,
superSay.call(this)
這個裡面的call
,只是改變了this
的上下文而已。但由於superSay
即實例X.say
,這個方法裡根本沒有this
,所以this
上下文的修改並不影響運行的結果。這個問題在js中經常遇見
個人觀點:先說下查找say方法的查找順序吧:s——student.prototype——people.prototype——Object,找到則就緒,停止查找。結合你的程式碼,say只會查找到student.prototype。這裡可以先把你的程式碼先改成這樣就比較清楚:
其他不變。此時s.say()——輸出321,s.jiao()——輸出456。然後再回到你的程式碼,因為你這是重寫了sdudent.prototype.say方法所以會執行此段程式碼
第一句superSay.call(this),首先superSay是一個變量,變數類型是function,你可以在var superSay = Student.prototype.say後面加上一段程式碼console.log(typeof supperSay),所以你只是在呼叫這個函數,而這個變數儲存的是Student.prototype.say。執行到var superSay = Student.prototype.say,其實這裡賦值的是 People.prototype.say。這點在高程的166-167頁有類似的。關於這點你可以再把你的程式碼這2段換成這樣,其他不變。
此時呼叫superSay 會報錯,因為此時執行到var superSay = Student.prototype.say時;student.prototype只有一個constructer屬性沒有say方法。然後回到你的程式碼此時People.prototype.say會賦值給superSay
把superSay建構子中的this綁定為Student.prototype.
樓上扯這麼多不怕樓主蒙圈嗎
他程式裡面stuSay指向的是function () {alert("hello");} 這個匿名函數對象,只要你不重新賦值stuSay,他一直就是指向這個函數對象,管你在什麼地方調用,永遠就是這麼個結果,至於在函數體內部this指向誰,你看下犀牛書吧....
樓主把犀牛書函數部分看完就不會有這些問題了,至於樓上扯那麼多,真別把樓主扯暈了