JavaScript高級程序設(shè)計(jì) 閱讀筆記(十三) js定義類或?qū)ο?/h1>
更新時(shí)間:2012年08月14日 16:04:46 作者:
js定義類或?qū)ο蟮慕榻B,需要的朋友可以參考下
工廠方式
創(chuàng)建并返回特定類型的對象?! ?
復(fù)制代碼 代碼如下:
function createCar(sColor,iDoors,iMpg){
var oTempCar=new Object();
oTempCar.color=sColor;
oTempCar.doors=iDoors;
oTempCar.mpg=iMpg;
oTempCar.showColor=function(){
alert(this.color);
}
return oTempCar;
}
調(diào)用示例:
復(fù)制代碼 代碼如下:
var oCar1=createCar("red",4,23);
var oCar2=createCar("blue",3,25);
oCar1.showColor();
oCar2.showColor();
缺點(diǎn):方法重復(fù)創(chuàng)建了。如在上面的調(diào)用示例中,oCar1和oCar2均有自己的shoColor方法,但這個是可以共用的。
構(gòu)造函數(shù)方式
示例:
復(fù)制代碼 代碼如下:
function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
this.showColor=function(){
alert(this.color);
}
}
調(diào)用示例:
復(fù)制代碼 代碼如下:
var oCar1=new Car("red",4,23);
var oCar2=new Car("blue",3,25);
缺點(diǎn):跟工廠方式一樣,方法重復(fù)創(chuàng)建了。
原型方式
本方式利用了對象的 prototype 屬性,可把它看成創(chuàng)建新對象所依賴的原型。這里用空構(gòu)造函數(shù)來設(shè)置類名,然后所有的屬性和方法都被直接賦予 prototype 屬性,重寫前面的例子,代碼如下:
復(fù)制代碼 代碼如下:
function Car(){
}
Car.prototype.color="red";
Car.prototype.doors=4;
Car.prototype.mpg=23;
Car.prototype.showColor=function(){
alert(this.color);
}
調(diào)用:
復(fù)制代碼 代碼如下:
var oCar1=new Car();
var oCar2=new Car();
缺點(diǎn):不能通過給構(gòu)造函數(shù)傳遞參數(shù)初始化屬性的值
混合的構(gòu)造函數(shù)/原型方式
聯(lián)合使用構(gòu)造函數(shù)和原型方式,示例如下:
復(fù)制代碼 代碼如下:
function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
}
Car.prototype.showColor=function(){
alert(this.color);
}
調(diào)用示例:
復(fù)制代碼 代碼如下:
var oCar1=new Car("red",4,23);
var oCar2=new Car("blue",3,25);
優(yōu)點(diǎn):無內(nèi)存浪費(fèi),創(chuàng)建方便。
這種方式是ECMAScript采用的主要方式。
動態(tài)原型方法
使用混合的構(gòu)造函數(shù)/原型方式把對象的方法放在了對象外面定義,讓人感覺不是那么面向?qū)ο?,沒有在視覺上進(jìn)行很好的封裝,因此產(chǎn)生了動態(tài)原型方法:
復(fù)制代碼 代碼如下:
function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
if(typeof Car._initialized=="undefined"){
Car.prototype.showColor=function(){
alert(this.color);
};
Car._initialized=true;
}
}
作者:Artwl
出處:http://artwl.cnblogs.com
相關(guān)文章
-
如何在JavaScript中使用localStorage詳情
這篇文章主要介紹了如何在JavaScript中使用localStorage,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧 2021-02-02
-
微信小程序以ssm做后臺開發(fā)的實(shí)現(xiàn)示例
這篇文章主要介紹了微信小程序以ssm做后臺開發(fā)的實(shí)現(xiàn)示例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧 2020-04-04
-
JavaScript實(shí)現(xiàn)復(fù)制功能各瀏覽器支持情況實(shí)測
這兩天在做Web前端時(shí),遇到需求通過js實(shí)現(xiàn)文本復(fù)制的功能,下面與大家分享下各瀏覽器對復(fù)制功能的支持情況,感興趣的朋友可以參考下哈 2013-07-07
-
javascript 函數(shù)聲明與函數(shù)表達(dá)式的區(qū)別介紹
javascript中的函數(shù)聲明與函數(shù)表達(dá)式使用比較頻繁,可能很多的朋友都不知道他們之間的區(qū)別,在此為大家詳細(xì)介紹下,希望對大家有所幫助 2013-10-10
-
微信小程序網(wǎng)絡(luò)層封裝的實(shí)現(xiàn)(promise, 登錄鎖)
這篇文章主要介紹了微信小程序網(wǎng)絡(luò)層封裝(promise, 登錄鎖),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧 2019-05-05
最新評論
創(chuàng)建并返回特定類型的對象?! ?
復(fù)制代碼 代碼如下:
function createCar(sColor,iDoors,iMpg){
var oTempCar=new Object();
oTempCar.color=sColor;
oTempCar.doors=iDoors;
oTempCar.mpg=iMpg;
oTempCar.showColor=function(){
alert(this.color);
}
return oTempCar;
}
調(diào)用示例:
復(fù)制代碼 代碼如下:
var oCar1=createCar("red",4,23);
var oCar2=createCar("blue",3,25);
oCar1.showColor();
oCar2.showColor();
缺點(diǎn):方法重復(fù)創(chuàng)建了。如在上面的調(diào)用示例中,oCar1和oCar2均有自己的shoColor方法,但這個是可以共用的。
構(gòu)造函數(shù)方式
示例:
復(fù)制代碼 代碼如下:
function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
this.showColor=function(){
alert(this.color);
}
}
調(diào)用示例:
復(fù)制代碼 代碼如下:
var oCar1=new Car("red",4,23);
var oCar2=new Car("blue",3,25);
缺點(diǎn):跟工廠方式一樣,方法重復(fù)創(chuàng)建了。
原型方式
本方式利用了對象的 prototype 屬性,可把它看成創(chuàng)建新對象所依賴的原型。這里用空構(gòu)造函數(shù)來設(shè)置類名,然后所有的屬性和方法都被直接賦予 prototype 屬性,重寫前面的例子,代碼如下:
復(fù)制代碼 代碼如下:
function Car(){
}
Car.prototype.color="red";
Car.prototype.doors=4;
Car.prototype.mpg=23;
Car.prototype.showColor=function(){
alert(this.color);
}
調(diào)用:
復(fù)制代碼 代碼如下:
var oCar1=new Car();
var oCar2=new Car();
缺點(diǎn):不能通過給構(gòu)造函數(shù)傳遞參數(shù)初始化屬性的值
混合的構(gòu)造函數(shù)/原型方式
聯(lián)合使用構(gòu)造函數(shù)和原型方式,示例如下:
復(fù)制代碼 代碼如下:
function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
}
Car.prototype.showColor=function(){
alert(this.color);
}
調(diào)用示例:
復(fù)制代碼 代碼如下:
var oCar1=new Car("red",4,23);
var oCar2=new Car("blue",3,25);
優(yōu)點(diǎn):無內(nèi)存浪費(fèi),創(chuàng)建方便。
這種方式是ECMAScript采用的主要方式。
動態(tài)原型方法
使用混合的構(gòu)造函數(shù)/原型方式把對象的方法放在了對象外面定義,讓人感覺不是那么面向?qū)ο?,沒有在視覺上進(jìn)行很好的封裝,因此產(chǎn)生了動態(tài)原型方法:
復(fù)制代碼 代碼如下:
function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
if(typeof Car._initialized=="undefined"){
Car.prototype.showColor=function(){
alert(this.color);
};
Car._initialized=true;
}
}
作者:Artwl
出處:http://artwl.cnblogs.com
相關(guān)文章
如何在JavaScript中使用localStorage詳情
這篇文章主要介紹了如何在JavaScript中使用localStorage,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-02-02
微信小程序以ssm做后臺開發(fā)的實(shí)現(xiàn)示例
這篇文章主要介紹了微信小程序以ssm做后臺開發(fā)的實(shí)現(xiàn)示例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04
JavaScript實(shí)現(xiàn)復(fù)制功能各瀏覽器支持情況實(shí)測
這兩天在做Web前端時(shí),遇到需求通過js實(shí)現(xiàn)文本復(fù)制的功能,下面與大家分享下各瀏覽器對復(fù)制功能的支持情況,感興趣的朋友可以參考下哈2013-07-07
javascript 函數(shù)聲明與函數(shù)表達(dá)式的區(qū)別介紹
javascript中的函數(shù)聲明與函數(shù)表達(dá)式使用比較頻繁,可能很多的朋友都不知道他們之間的區(qū)別,在此為大家詳細(xì)介紹下,希望對大家有所幫助2013-10-10
微信小程序網(wǎng)絡(luò)層封裝的實(shí)現(xiàn)(promise, 登錄鎖)
這篇文章主要介紹了微信小程序網(wǎng)絡(luò)層封裝(promise, 登錄鎖),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2019-05-05

