最优化javascript自定义对象(转自:http://www.cnblogs.com/QiuYun/archive/2007/03/22/684523.html)...

本文探讨了JavaScript中创建对象的六种模式:工厂方式、构造函数方法、原型方式、混合构造函数/原型方式、动态原型方法及混合工厂方式。对比了它们的特点、优缺点,并推荐了混合构造函数/原型方式。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.工厂方式
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 = create("red",4,23);的时候都要从新创建新的showColor 函数,这样就以为这每个对象都有自己的函数。
解决的方法:
function showColor(){ alert(this.color); } function createCar(sColor, iDoors, iMpg){ var oTempCar= new Object(); oTempCar.color = sColor; oTempCar.doors = iDoors; oTempCar.mpg = iMpg; oTempCar.showColor = showColor; return oTempCar; }

ps:这样写看起来好丑,不象一个对象了。

2.构造函数方法
function Car(sColor, iDoors, iMpg){ this.color = sColor; this.doors = iDoors; this.mpg = iMpg; this.showColor = function(){ alert(this.color); }; }

ps:默认是返回this,所以没必要写return this;
缺点:创建对象的时候也要不停的创建新的函数showColor

3.原型方式
function Car(){ } Car.prototype.color = "red"; Car.prototype.dorrs = 4; Car.prototype.mpg =23; Car.prototype.showColor = function(){ alert(this.color); }; Car.prototype.drivers = new Array("Mile","Sue"); var oCar1 = new Car(); var oCar2 = new Car(); oCar1.drivers.push("Matt"); alert(oCar1.drivers); //输出"Mike,Sue,Matt" alert(oCar2.drivers); //输出"Mike,Sue,Matt" } Car.prototype.color = "red"; Car.prototype.dorrs = 4; Car.prototype.mpg =23; Car.prototype.showColor = function(){ alert(this.color); }; Car.prototype.drivers = new Array("Mile","Sue"); var oCar1 = new Car(); var oCar2 = new Car(); oCar1.drivers.push("Matt"); alert(oCar1.drivers); //输出"Mike,Sue,Matt" alert(oCar2.drivers); //输出"Mike,Sue,Matt"


缺点:构造函数没参数;当属心为对象时候,所有被实力化的Car的对象属性都一样!

4.混合的构造函数/原型方式
用构造函数定义对象的所有非函数属性,用原型方式定义对象的函数属性(方法)
function Car(sColor,iDoors,iMpg){ this.Color = sColor; this.doors = iDoors; this.mpg = iMpg; this.drivers = new Array("Mike","Sue"); } Car.prototype.showColor = function(){ alert(this.color); };

这样问题就都解决了,不过OOPer决定它不完美

5.动态原型方法
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; } }

这样所有问题都解决并且向个正真的对象了

6。混合工厂方式
function Car(){ var oTempCar = new Object; oTempCar.color = "red"; oTempCar.doors = 4; oTempCar.mpg = 23; oTemp.showColor = function(){ alert(this.color) }; return oTempCar; }

这种方式通常是在不能应用前一种方式时的变通方式。创建假构造函数,返回另一种对象的新实例。

总结:目前用的最多的是混合的构造函数/原型方式,此外动态原型也很流行,不咬单独使用经典的构造函数或原型方式,这样的代码会有问题。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值