javaScript设计模式——模板方法模式

模板方法模式是一种只需继承就可以实现的非常简单的模式。模板方法模式由2部分组件:第一部分是抽象父类,第二部分是具体的实现子类。
那么:通常情况下抽象父类封装了子类的算法框架,包括一些公共的方法以及封装了子类中所有方法的执行顺序。子类通过继承这个抽象类,也继承了整个算法的结构,并且可以选择重新写父类的方法。
在模板方法里,子类实现的相同部分可以被移到父类中,而将不同的部分留在子类内部。
如下的代码就是用函数来封装了一个怎么泡咖啡和怎么泡茶的一个父类过程。**子类必须重写brew,pourIncup ,addCondiments函数,如果没有重写可抛出一个异常来解决提示程序员;**并且boilWater函数是共同的方法。
在Beverage类中,其实所谓的模板方法是F函数----F.prototype.init

var Beverage=function(param){
			var boilWater=function(){
				console.log('把水煮沸')
			};
			var brew=param.brew||function(){
				throw new Error('必须传递brew方法')
			};
			var pourIncup =param.pourIncup ||function(){
				throw new Error('必须传递pourIncup方法')
			};
			var addCondiments=param.addCondiments ||function(){
				throw new Error('必须传递addCondiments方法')
			};
			var F=function(){};
			F.prototype.init=function(){
				boilWater();
				brew();
				pourIncup();
				addCondiments();
			}
			return F;
		}

那么模板方法模式的运用场景是在哪呢?在web开发中,其实有很多运用到模板方法模式,比如我们渲染一个UI组件。
1、初始化一个div,
2、获取数据,
3、把数据渲染到div里面,完成组件构造,
4、通知渲染完毕。
其实我们现在的用的vue框架,react框架也是一种模板方法模式的运用。那么可能有人会问,那那些钩子函数如何解释呢?
其实模板方法也可封装这个钩子。比如有人喝咖啡想加糖有人不想加。那么可编写一个hook,放在所谓的模板方法里,然后子类可以重写这个hook。
好莱坞原则:
允许底层组件将自己挂钩到高层组件中,而高层组件会决定什么时候、以何种方式去使用这些底层的组件。模板方法模式就是一种好莱坞原则的典型运用场景。意味着子类放弃对自己的控制权,把控制权交给父类。
1、模板方法模式
2、订阅发布模式
3、回调函数
都是好莱坞原则的典型运用场景,把控制权交给别人,而不是自己本身的函数。可以理解成:
“你别调用,我们会调用你”

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值