JavaScript学习之一:采用哪种方式定义类或对象?

本文介绍了JavaScript中创建对象的多种方式,包括直接赋值、工厂模式、构造函数、原型继承及混合模式等,并对比了各自的优缺点。

JavaScript中定义类或对象有多种方法:

以创建Car为实例说明。

var oCar = new Object;
oCar.color ="red";
oCar.doors = 4;
oCar.mpg=23;
oCar.showColor = function()
{
alert(this.color);
}

  • 工厂方式构造,例如:

    function createCar(sColor,iDoors,iMpg)
    {
    var oTempCar = new Object;
    oTempCar.color = sColor;
    oTempCar.doors=iDoors;
    oTempCar.mpg=iMpg;
    oTempCar.showColor = function()
    {
    al(this.color)
    }
    return oTempCar;
    }

弊端:每个对象都有自己的一个showColor函数。

  • 构造函数方式:

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

弊端:构造函数重复生成函数,可以用外部函数重写构造函数(不太懂);

  • 原型方式:该方式利用了prototype属性。

function Car()
{

}
Car.prototype.color = "red";
Car.prototype.doors =4;
Car.prototype.mpg = 23;
Car.prototype.drivers = new Array("Mike","Sue");
Car.prototype.showColor = function()
{
alert(this.color);
}

弊端:给一个实例添加drivers,另一个实例也添加了。

  • 混合的构造函数、原型方式

function Car()
{

}
Car.prototype.color = "red";
Car.prototype.doors =4;
Car.prototype.mpg = 23;
Car.prototype.drivers = new Array("Mike","Sue");
Car.prototype.showColor = function()
{
alert(this.color);
}
解决了两种弊端。

  • 动态原型构造

function Car(sColor,iDoors,iMpg)
{
this.color = sColor;
this.doors = iDoors;
this.mpg = iMpg;
this.drivers = new Array("Mike","Sue");

if(typeof Car._initialized == "undefined")
{
Car.prototype.showColor = function()
{
alert(this.color)
}
car._initialized = true;
}
}

  • 混合工厂方式。

function Car()
{
var oTempCar = new Object;
oTempCar.color="red";
oTempCar.doors = 4;
oTempCar.mpg = 23;
oTempCar.showColor = function()
{
ale(this.color)
}
return oTempCar;
}

采用哪种方式:

目前流行的是构造函数、原型方式,此外动态原型方式较为流行。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值