news 2026/7/5 4:10:33

设计模式之-模板模式

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
设计模式之-模板模式

模板方法模式是一种只需使用继承就可以实现的非常简单的模式

它由两部分构成,1.抽象父类2.具体实现子类。通常在抽象父类中封装了子类的算法框架,包括实现一些公共方法以及封装子类中所有的执行顺序,子类通过继承这个抽象类,也继承了整个算法结构,并且可以选择重写父类的方法。

来看一个咖啡与茶的例子

// 1.先泡一杯咖啡classCoffee{boilWater(){console.log('把水煮沸');}brewCoffeeGriends(){console.log('用沸水冲泡咖啡');}pourInCup(){console.log('把咖啡倒进杯子');}addSugarAndMilk(){console.log('加糖和牛奶');}init(){this.boilWater();this.brewCoffeeGriends();this.pourInCup();this.addSugarAndMilk();}}constcoffee=newCoffee();coffee.init();//2.泡一壶茶classTea{boilWater(){console.log('把水煮沸');}steepTeaBag(){console.log('用沸水浸泡茶叶');}pourInCup(){console.log('把茶水倒进杯子');}addLemon(){console.log('加柠檬');}init(){this.boilWater();this.steepTeaBag();this.pourInCup();this.addLemon();}}consttea=newCoffee();tea.init();

分离共同点

// 让我们忘记最开始创建的Coffee类和Tea类,现在可以创建一个抽象父类来表示泡一杯饮料的整个过程。abstractclassBeverage{boilWater(){console.log("把水煮沸");}abstractbrew():void;// 抽象方法,由子类重写abstractpourInCup():void;// 抽象方法,由子类重写abstractaddCondiments():void;// 抽象方法,由子类重写init(){this.boilWater();this.brew();this.pourInCup();this.addCondiments();}}// 现在来创建Coffee类和Tea类classCoffeeextendsBeverage{brew():void{console.log("用沸水冲泡咖啡");}pourInCup():void{console.log("把咖啡倒进杯子");}addCondiments():void{console.log("加糖和牛奶");}}classTeaextendsBeverage{brew():void{console.log("用沸水浸泡茶叶");}pourInCup():void{console.log("把茶水倒进杯子");}addCondiments():void{console.log("加柠檬");}}// 使用constcoffee=newCoffee();coffee.init();consttea=newTea();tea.init();

在上面的例子中,到底谁才是所谓的模版方法呢,答案是Beverage类中的init方法,该方法封装了子类算法框架,他作为一个算法模版,指导子类以何种顺序去执行那些方法,在init方法中算法内的每一个步骤都清楚地展示在我们面前。

这些算法框架在正常状态下是适用于大多数子类的,但如果有一些特别“个性”的子类呢?比如有一些客人喝咖啡不加调料(糖和牛奶),有什么半打可以让子类不受这个约束呢?那么钩子方法可以用来解决这个问题,放置钩子是隔离变化的一种常见手段。我们在父类中容易变化的地方放置钩子,钩子可以有一个默认的实现,究竟要不要“挂钩”,这由子类自行决定。

abstractclassBeverage{boilWater(){console.log("把水煮沸");}abstractbrew():void;// 抽象方法,由子类重写abstractpourInCup():void;// 抽象方法,由子类重写abstractaddCondiments():void;// 抽象方法,由子类重写customerWantsCondiments(){returntrue;// 默认需要调料}init(){this.boilWater();this.brew();this.pourInCup();if(this.customerWantsCondiments()){//如果挂钩返回true,则需要调料this.addCondiments();}}}// 现在来创建Coffee类和Tea类classCoffeeextendsBeverage{brew():void{console.log("用沸水冲泡咖啡");}pourInCup():void{console.log("把咖啡倒进杯子");}addCondiments():void{console.log("加糖和牛奶");}customerWantsCondiments(){returnwindow.confirm('请问需要调料吗?')}}classTeaextendsBeverage{brew():void{console.log("用沸水浸泡茶叶");}pourInCup():void{console.log("把茶水倒进杯子");}addCondiments():void{console.log("加柠檬");}}// 使用constcoffee=newCoffee();coffee.init();consttea=newTea();tea.init();

非原创,来源于javascript设计模式与开发实践 -曾探

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/7/1 9:49:00

错过等一年!Open-AutoGLM正式开源,AI开发者必备的5个使用技巧

第一章:Open-AutoGLM 开源 地址 Open-AutoGLM 是一个面向自动化自然语言处理任务的开源框架,旨在简化大语言模型在实际业务场景中的集成与调优流程。该项目由社区驱动开发,代码托管于主流开源平台,便于开发者协作贡献与持续集成。…

作者头像 李华
网站建设 2026/7/1 20:31:44

【AndrejKarpathy】2025年AI大模型深度复盘:年度最深刻的行业分析!

AndrejKarpathy前几天发了一篇2025年LLM年度回顾。他是OpenAI联合创始人、前特斯拉AI总监,也是全球最有影响力的AI研究者之一。这篇文章里有6个观点,每一个都理解得非常深刻。强烈推荐大家看看。 第一: 训练方法彻底变了 2025年之前,训练一个…

作者头像 李华
网站建设 2026/7/4 21:46:41

MCP在7大AI框架中的实践应用,使用Python和TypeScript框架为LLM赋能!

MCP支持的AI框架 MCP支持的AI框架 AI代理工具包为开发者开放了各种API,让AI解决方案具备执行任务的工具,确保能给出准确结果,提升用户满意度。然而,把这些工具集成到AI应用里并进行管理,过程往往很繁琐。本文将为你介…

作者头像 李华
网站建设 2026/7/1 21:06:43

基于物联网的水环境智慧服务监测系统(有完整资料)

资料查找方式:特纳斯电子(电子校园网):搜索下面编号即可编号:T5702301M设计简介:本设计是基于STM32的水环境智慧服务监测系统,主要实现以下功能:1.可通过名类传感器实时采集环境中水…

作者头像 李华