首页 > 代码库 > javascript设计模式8
javascript设计模式8
桥接模式（将抽象与其实现隔离开来，以便二者独立变化）
function sendInfo(element){ var id=element.id; ajax("GET","info.json?id="+id,function(result){ //... }); //...};
上例的ajax请求与sendInfo函数可以拆分开
function sendInfo(element){ var id=element.id, callback=function(result){ //... }; sendInfoBridge(id,callback);}function sendInfoBridge(id,callback){ ajax("GET","info.json?id="+id,function(result){ callback(result); });}
组合模式（用一条命令在多个对象上激发复杂的或递归的行为），组合对象和叶对象
条件一：存在一批组织成某种层次体系的对象
条件二：希望对这批对象或其中一部分对象进行操作
组合对象
var Composite=new Interface(‘Composite‘,[‘add‘,‘remove‘,‘getChild‘]);var GalleryItem=new Interface(‘GalleryItem‘,[‘hide‘,‘show‘]);var DynamicGallery=function(id){ this.children=[]; this.element=document.createElement(‘div‘); this.element.id=id; this.element.className=‘dynamic-gallery‘;}DynamicGallery.prototype={ add:function(child){ Interface.ensureImplements(child,Composite,GalleryItem); this.children.push(child); this.element.appendChild(child.getElement()); }, remove:function(child){ for(var node,i=0;node=this.getChild(i);i++){ if(node==child){ this.children.splice(i,1); break; } } this.element.removeChild(child.getElement()); }, getChild:function(i){ return this.children[i]; }, hide:function(){ for(var node,i=0;node=this.getChild(i);i++){ node.hide(); } this.element.style.display=‘none‘; }, show:function(){ this.element.style.display=‘block‘; for(var node,i=0;node=this.getChild(i);i++){ node.show(); } }, getElement:function(){ return this.element; }};
叶对象
var GalleryImage=function(src){ this.element=dicument.createElement(‘img‘); this.element.className=‘gallery-image‘; this.element.src=http://www.mamicode.com/src;}GalleryImage.prototype={ add:function(){}, remove:function(){}, getChild:function(){}, hide:function(){ this.element.style.display=‘none‘; }, show:function(){ this.element.style.display=‘‘; }, getElement:function(){ return this.element; }};
var topGallery=new DynamicGallery(‘top-gallery‘);topGallery.add(new GalleryImage(‘/img/image-1.jpg‘));topGallery.add(new GalleryImage(‘/img/image-2.jpg‘));topGallery.add(new GalleryImage(‘/img/image-3.jpg‘));var vacationPhotos=new DynamicGallery(‘vacation-photos‘);for(var i=0;i<30;i++){ vacationPhotos.add(new GalleryImage(‘/img/vac/image-‘+i+‘.jpg‘));}topGallery.add(vacationPhotos);topGallery.show();vacationPhotos.hide();
javascript设计模式8
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。