先看下面一段代碼:
function Machine(ecode, horsepower) { this.ecode = ecode; this.horsepower = horsepower;}function showme() { alert(this.name + " " + this.ecode + " " + this.horsepower);}var machine = new Machine("code1", 15);machine.name = "machine1";machine.showme = showme;machine.showme();這樣一段代碼,雖然建立了一個Machine對象后,通過machine.showme = showme;使得showme函數變成了Machine對象machine的方法。
但是,就看上面兩個函數(一個是對象的構造函數,一個是普通方法)沒有任何關系,這樣的代碼,不是那么“優雅“,因此,便有了prototype。
//機器function Machine(ecode, horsepower) { this.ecode = ecode; this.horsepower = horsepower;}//特別注意這一句,Machine.prototype是第一次初始化的時候就初始化好的,//當調用Machine作為構造函數的時候,engine的值不會再改變Machine.prototype.engine = this.ecode + " " + this.horsepower;Machine.prototype.showme = function () { alert(this.name + " " + this.ecode + " " + this.horsepower); }利用以上代碼,所有的Machine對象就有了showme方法了。
但是要特別注意:
prototype只是面對實例的,而不是面對類對象的。(js中,類本身就是一個對象)所以Machine.showme();會報錯誤,因為Machine這個對象是沒有showme方法的。
那么,我們怎么使用showme方法呢?必須得新建一個Machine實例,只有Machine實例才會有這個方法。
var machine = new Machine("code1", 15);machine.name = "machine1";machine.showme(); //輸出machine1 code1 15。有了prototype之后,我們更加容易實現繼承關系。比如我現在寫一個Car類,需要繼承目前這個Machine類,只需要寫如下代碼即可:
//小汽車function Car(name, ecode, horsepower) { this.name = name; //調用父類的構造函數,使得Car的對象有ecode、horsepower屬性 Machine.call(this, ecode, horsepower);}//Car的原型指向Machine,使Car對象有Machine原型的任意屬性和方法,比如showmeCar.prototype = new Machine();這里如何調用父構造函數,以及如何獲得父類的原型,注釋的都很清楚,就不在贅述了。
然后,我們可以新建一個對象測試一下:
//新建一個類Car的對象。var xiali = new Car("xiali", "aaa", 15);alert(xiali.engine);xiali.showme();以上,是prototype的基本應用,但是也是prototype的最主要的應用。
掌握的prototype的使用,在以后的過程中,對于對象的構建和繼承,會有更深層次的理解。
查看更多JavaScript的語法,大家可以關注:《JavaScript 參考教程》、《JavaScript代碼風格指南》,也希望大家多多支持武林網。
新聞熱點
疑難解答