javascript 中模板方法单例的实现方法
javascript中模板方法单例的实现方法
模板方法单例
模板方法的定义：父类中定义一组操作算法骨架，将一些实现步骤延伸到子类中，使得子类可以不改变父类的算法结构的同时可重新定义算法中某些实现步骤。
代码块
html部分，例如：
js部分，例如：
//格式化字符串方法
functionfromateString(str,data){
returnstr.replace(/\{#(\w+)#\}/g,function(match,key){
returntypeofdata[key]===undefined?'':data[key]
});
}
//基础导航
varNav=function(data){
//基础导航样式模板
this.item='{#name#}';
//创建字符串
this.html='';
for(vari=0;i=0;i--){
data[i].name+=data[i].name+fromateString(tpl,data[i]);
}
returnNav.call(this,data);
}
//带有链接地址的导航
varLinkNav=function(data){
//消息提醒小心组件模板
vartpl='{#link#}';
for(vari=data.length-1;i>=0;i--){
data[i].name+=data[i].name+fromateString(tpl,data[i]);
}
returnNav.call(this,data);
}
//测试带有信息提示的导航
varnav=document.getElementById('content');
nav.innerHTML=NumNav([
{
href:'www.baidu.com',
title:'百度一下你就知道',
name:'百度',
num:10,
link:'www.baidu.com'
},
{
href:'www.taobao.com',
title:'淘宝商城',
name:'淘宝',
num:2,
link:'www.taobao.com'
},
{
href:'www.qq.com',
title:'腾讯首页',
name:'腾讯',
num:3,
link:'www.qq.com'
}
]);
其实模板方法模式不仅仅在我们归一化组件的时候使用有时候创建页面时也是很常用到的。通过上述代码可以衍生出的静态页面的封装以及业务逻辑的交互封装。
如有疑问请留言或者到本站社区交流讨论，感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！