快捷導(dǎo)航

javaScript面向?qū)ο罄^承方法經(jīng)典實(shí)現(xiàn)

更新時(shí)間：2013年08月20日 19:10:14 作者：

很多人都說JavaScript不能算是面向?qū)ο蟮淖兂烧Z(yǔ)言。但是JavaScript的類型非常松散，也沒有編譯器,但是我們可以模仿著其他語(yǔ)言實(shí)現(xiàn)面向?qū)ο蟮姆绞絹韺?shí)現(xiàn)JavaScript的面向編程

JavaScript的出現(xiàn)已經(jīng)將近20多年了，但是對(duì)這個(gè)預(yù)言的褒貶還是眾說紛紜。很多人都說JavaScript不能算是面向?qū)ο蟮淖兂烧Z(yǔ)言。但是JavaScript的類型非常松散，也沒有編譯器。這樣一來給了程序員很大的自由，也帶來了一些缺陷。

雖然JavaScript不算是一門面向?qū)ο蟮恼Z(yǔ)言。但是我們可以模仿著其他語(yǔ)言實(shí)現(xiàn)面向?qū)ο蟮姆绞絹韺?shí)現(xiàn)JavaScript的面向編程。

下面是JavaScript教程中非常經(jīng)典的繼承方法。

復(fù)制代碼代碼如下:

 
//定義一個(gè)Pet對(duì)象。通過這一個(gè)名稱和數(shù)量的腿。 
var Pet = function (name,legs) { 
this.name = name; //Save ths name and legs values. 
this.legs = legs; 
}; 

//創(chuàng)建一個(gè)方法,顯示了Pet的名字和數(shù)量的腿。 
Pet.prototype.getDetails = function () { 
return this.name + " has " + this.legs + " legs "; 
} 

//定義一個(gè)Cat對(duì)象,繼承從Pet。 
var Cat = function (name) { 
Pet.call(this,name,4); //調(diào)用這個(gè)父對(duì)象的構(gòu)造函數(shù) 
}; 

//這條線執(zhí)行繼承從Pet。 
Cat.prototype = new Pet(); 

//增加一個(gè)動(dòng)作方法的貓 
Cat.prototype.action = function () { 
return "Catch a bird"; 
}; 

//創(chuàng)建一個(gè)實(shí)例petCat的貓。 
var petCat = new Cat("felix"); 

var details = petCat.getDetails(); 
console.log(details) //"felix has 4 legs". 
var action = petCat.action(); 
console.log(action) //"Catch a bird". 
petCat.name = "sylvester"; //改變petCat的名字 
petCat.legs = 7; //改變petCat腿的數(shù)量 
details = petCat.getDetails(); 
console.log(details) //"sylvester has 7 legs". 

上述方法雖然執(zhí)行起來沒有太大的問題，但是代碼整體風(fēng)格略顯臃腫，并不很優(yōu)雅。在外面還是可以對(duì)屬性進(jìn)行修改。這種方法沒有對(duì)繼承的屬性進(jìn)行保護(hù)。下面一種方法，省去的new和prototype，利用“函數(shù)繼承”的特性實(shí)現(xiàn)。

復(fù)制代碼代碼如下:

 
//定義一個(gè)pet對(duì)象。通過這一個(gè)名稱和數(shù)量的腿。 
var pet = function (name,legs) { 
//創(chuàng)建一個(gè)對(duì)象that，其中名字是可以改的，但是腿數(shù)不可以改，實(shí)現(xiàn)了變量私有化。 
var that = { 
name : name, 
getDetails : function () { 
return that.name + " has " + legs + " legs "; 
} 
}; 

return that; 
} 

//定義一個(gè)cat對(duì)象,繼承從pet。 
var cat = function (name) { 
var that = pet(name,4); //從pet中繼承屬性 

//cat中增加一個(gè)action的方法。 
that.action = function () { 
return "Catch a bird"; 
} 

return that; 

} 

//創(chuàng)建一個(gè)petCat2; 
var petCat2 = cat("Felix"); 

var details = petCat2.getDetails(); 
console.log(details) //"felix has 4 legs". 
var action = petCat2.action(); 
console.log(action) //"Catch a bird". 
petCat2.name = "sylvester"; //我們可以改變名字。 
petCat2.legs = 7; //但是不可以改變腿的數(shù)量 
details = petCat2.getDetails(); 
console.log(details) //"sylvester has 4 legs". 

溫馨提示：使用原型繼承的好處是內(nèi)存效率高，不管它被繼承多少次，對(duì)象的原型屬性和方法只被保存一次。函數(shù)繼承的時(shí)候，每個(gè)新的實(shí)例都會(huì)創(chuàng)建重復(fù)的屬性和方法。若創(chuàng)建很多大的對(duì)象，內(nèi)存消耗會(huì)很大。解決方法是把較大的屬性或方法保存在一個(gè)對(duì)象中，并將其作為參數(shù)傳給構(gòu)造函數(shù)。這樣所有實(shí)例就會(huì)使用一個(gè)對(duì)象資源，而不是創(chuàng)建自己的版本了。

上面兩種方法都可以輕松實(shí)現(xiàn)JavaScript面向?qū)ο蟮睦^承，沒有哪種方法絕對(duì)的好，也沒有哪種方法絕對(duì)的不好。依個(gè)人情況喜好而定。這兩種方法也不是唯一的，歡迎大家評(píng)論補(bǔ)充喲!~

您可能感興趣的文章: