Heim > Web-Frontend > js-Tutorial > JavaScript高级程序设计 阅读笔记(十三) js定义类或对象_javascript技巧

JavaScript高级程序设计 阅读笔记(十三) js定义类或对象_javascript技巧

WBOY
Freigeben: 2016-05-16 17:51:03
Original
981 Leute haben es durchsucht
工厂方式

  创建并返回特定类型的对象。  

复制代码 代码如下:

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;
}

  调用示例:
复制代码 代码如下:

var oCar1=createCar("red",4,23);
var oCar2=createCar("blue",3,25);
oCar1.showColor();
oCar2.showColor();

  缺点:方法重复创建了。如在上面的调用示例中,oCar1和oCar2均有自己的shoColor方法,但这个是可以共用的。

构造函数方式

  示例:

复制代码 代码如下:

function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
this.showColor=function(){
alert(this.color);
}
}

  调用示例:
复制代码 代码如下:

var oCar1=new Car("red",4,23);
var oCar2=new Car("blue",3,25);

  缺点:跟工厂方式一样,方法重复创建了。

原型方式

  本方式利用了对象的 prototype 属性,可把它看成创建新对象所依赖的原型。这里用空构造函数来设置类名,然后所有的属性和方法都被直接赋予 prototype 属性,重写前面的例子,代码如下:

复制代码 代码如下:

function Car(){
}

Car.prototype.color="red";
Car.prototype.doors=4;
Car.prototype.mpg=23;
Car.prototype.showColor=function(){
alert(this.color);
}


  调用:
复制代码 代码如下:

var oCar1=new Car();
var oCar2=new Car();

  缺点:不能通过给构造函数传递参数初始化属性的值

混合的构造函数/原型方式

  联合使用构造函数和原型方式,示例如下:

复制代码 代码如下:

function Car(sColor,iDoors,iMpg){
this.color=sColor;
this.door=iDoors;
this.mpg=iMpg;
}

Car.prototype.showColor=function(){
alert(this.color);
}

  调用示例:
复制代码 代码如下:

var oCar1=new Car("red",4,23);
var oCar2=new Car("blue",3,25);

  优点:无内存浪费,创建方便。

  这种方式是ECMAScript采用的主要方式。

动态原型方法

  使用混合的构造函数/原型方式把对象的方法放在了对象外面定义,让人感觉不是那么面向对象,没有在视觉上进行很好的封装,因此产生了动态原型方法:

复制代码 代码如下:

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
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage