javascript设计模式7
链式调用
(function(){ function _$(els){ //... } _$.prototype={ each:function(fn){ for(var i=0,len=this.elements.length;i<len;++i){ fn.call(this,this.elements[i]); } return this; }, setStyle:function(prop,val){ this.each(function(el){ el.style[prop]=val; }); return this; }, show:function(){ var that=this; this.each(function(el){ that.setStyle('display','block'); }); return this; }, addEvent:function(type,fn){ var add=function(el){ if(window.addEventListener){ el.addEventListener(type,fn,false); } else if(window.attachEvent){ el.attachEvent('on'+type,fn); } }; this.each(function(el){ add(el); }); return this; } }; window.$=function(){ return new _$(arguments); }; })();
从支持链式调用的方法获取数据
window.API=window.API||function(){ var name='Hello World'; this.setName=function(newName){ name=newName; return this; }; this.getName=function(callback){ callback.call(this,name); return this; }; }; var o2=new API; o2.getName(console.log).setName('Meow').getName(console.log);
简单工厂
var BicycleShop=function(){}; BicycleShop.prototype={ sellBicycle:function(model){ var bicycle; switch(model){ case'The Speedster': bicycle=new Speedster(); break; case'The Lowrider': bicycle=new Lowrider(); break; case'The Comfort Cruiser': default: bicycle=new ComfortCruiser(); } interface.ensureImplements(bicycle,Bicycle); bicycle.assemble(); bicycle.wash(); return bicycle; } };
把成员对象的创建工作交给外部对象
var BicycleFactory={ createBicycle:function(model){ var bicycle; switch(model){ case'The Speedster': bicycle=new Speedster(); break; case'The Lowrider': bicycle=new Lowrider(); break; case'The Flatlander': bicycle=new Flatlander(); break; case'The Comfort Cruiser': default: bicycle=new ComfortCruiser(); } Interface.ensureImplements(bicycle,Bicycle); } };
工厂模式(不是使用另外一个类或对象创建,而是使用子类创建)
var BicycleShop=function(){}; BicycleShop.prototype={ sellBicycle:function(model){ var bicycle=this.createBicycle(model); bicycle.assemble(); bicycle.wash(); return bicycle; }, createBicycle:function(model){ throw new Error('...')//抽象类,声明这个方法,但不实现这个方法,直接调用会报错 } };
var AcmeBicycleShop=function(){}; extend(AcmeBicycleShop,BicycleShop); AcmeBicycleShop.prototype.createBicycle=function(model){ var bicycle; switch(model){ case'The Speedster': bicycle=new AcmeSpeedster(); break; case'The Lowrider': bicycle=new AcmeLowrider(); break; case'The Comfort Cruiser': default: bicycle=new AcmeComfortCruiser(); } Interface.ensureImplements(bicycle,Bicycle); return bicycle; }; var GeneralProductsBicycleShop=function(){}; extend(GeneralProductsBicycleShop,BicycleShop); GeneralProductsBicycleShop.prototype.createBicycle=function(model){ var bicycle; switch(model){ case'The Speedster': bicycle=new GeneralProductsSpeedster(); break; case'The Lowrider': bicycle=new GeneralProductsLowrider(); break; case'The Comfort Cruiser': default: bicycle=new GeneralProductsComfortCruiser(); } Interface.ensureImplements(bicycle,Bicycle); return bicycle; }; //需要时任意调用即可 //var bobCruisers=new GeneralProductsBicycleShop(); //var yourSecondNewBike=bobCruisers.sellBicycle('The Lowrider');