JavaScript享元模式原理与用法实例详解
本文实例讲述了JavaScript享元模式原理与用法。分享给大家供大家参考，具体如下：
通过两个例子的对比来凸显享元模式的特点：享元模式是一个为了提高性能(空间复杂度)的设计模式，享元模式可以避免大量非常相似类的开销。
第一实例，没有使用享元模式，计算所花费的时间和空间使用程度。
要求为：有一个城市要进行汽车的登记
（1）汽车类
/**
*制造商
*型号
*拥有者
*车牌号码
*最近一次登记日期
*/
varCar=function(make,model,year,owner,tag,renewDate){
this.make=make;
this.model=model;
this.year=year;
this.owner=owner;
this.tag=tag;
this.renewDate=renewDate;
this.getMake=function(){
returnthis.make;
}
}
（2）使用装饰者模式--计算函数的耗时
//装饰者..计算函数的耗时
varsimpleProfiler=function(componet){
this.componet=componet;
this.action=function(methodName){
varself=this;
varmethod=componet[methodName];
//如果是函数那就进行装饰
if(typeofmethod=="function"){
varstartDate=newDate().getTime();//开始时间
method.apply(self.componet,arguments);
varendDate=newDate();//结束时间
alert(endDate-startDate);
}
}
}
（3）具体的实例，现有4150000辆车需要登记
varca=newArray();
functionaddCar(){
this.begin=function(){
for(vari=0;i<4150000;i++){
ca.push(newCar("BMW","宝马","2017-10-18",
"","GBMW88","2017-10-19"));
}
}
}
newsimpleProfiler(newaddCar()).action("begin")
第二个例子：使用享元模式
（1）汽车类
/**
*制造商
*型号
*拥有者
*车牌号码
*最近一次登记日期
*/
varCar=function(make,model,year){
this.make=make;
this.model=model;
this.year=year;
this.getMake=function(){
returnthis.make;
}
}
（2）单例模式的简单工厂
//单例模式的简单工厂
varmyCarInfo=function(){
this.createCar=function(make,model,year,owner,tag,renewDate){
varc=carInfoFactory(make,model,year);
c["owner"]=owner;
c["tag"]=tag;
c["renewDate"]=renewDate;
returnc;
}
}
varcarInfoFactory=(function(){
varcarInfo={};
returnfunction(make,model,year){
if(carInfo[make+model+year]){
returncarInfo[make+model+year];
}else{
varnewCar=newCar(make,model,year);
carInfo[make+model+year]=newCar;
returnnewCar;
a
}
}
})();
（3）现有4150000辆车需要登记
vartest=newmyCarInfo();
varstartDate=newDate().getTime();
varca=newArray();
for(vari=0;i<4150000;i++){
ca.push(test.createCar("BMW","宝马","2017-10-18",
"","GBMW88","2017-10-19"))
}
varendDate=newDate();
alert(endDate-startDate);
从上述两个例子可以知道，第一个例子没有使用享元模式相对于第二个使用享元模式耗时间少，但空间消耗大，第二个耗时多，但空间消耗小。
第一种情况图解：每次都生成相同的实例
第二种情况：内在部分（不变）+外部状态（变化）图解
感兴趣的朋友可以使用在线HTML/CSS/JavaScript前端代码调试运行工具：http://tools.jb51.net/code/WebCodeRun测试上述代码运行效果。
更多关于JavaScript相关内容还可查看本站专题：《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。