JavaScript模板方法模式

谁践踏了优雅 2022-05-27 00:18 60阅读 0赞

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

二、模板方法模式由两部分组成，第一部分是抽象父类，第二部分是具体的实现子类。

三、以设计模式中的Coffee or Tea来说明模板方法模式：

1、模板Brverage，代码如下：

var Beverage = function(){};
    Beverage.prototype.boilWater = function(){
       console.log('把水煮沸');
    };
    Beverage.prototype.pourInCup = function(){
        throw new Error( '子类必须重写pourInCup' );
    };
    Beverage.prototype.addCondiments = function(){
       throw new Error( '子类必须重写addCondiments方法' );
    };
    Beverage.prototype.customerWantsConditions = function(){
       return true; //默认需要调料
    };
    Beverage.prototype.init = function(){
       this.boilWater();
       this.brew();
       this.pourInCup();
       if(this.customerWantsCondiments()){
           //如果挂钩返回true，则需要调料
           this.addCondiments();
       }
    };

2、子类继承父类

var CoffeeWithHook = function(){};
    CoffeeWithHook.prototype = new Beverage();
    CoffeeWithHook.prototype.brew = function(){
       console.log('把咖啡倒进杯子');
    };
    CoffeeWithHook.prototype.addCondiments = function(){
       console.log('加糖和牛奶');
    };
    CoffeeWithHook.prototype.customerWantsCondiments = function(){
      return window.confirm( '请问需要调料吗？' );
    };

3、煮一杯咖啡

var coffeeWithHook = new CoffeeWithHook();
    coffeeWithHook.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;
    };
    
    var Coffee = Beverage({
       brew: function(){
             console.log( '用沸水冲泡咖啡' );
       },
       pourInCup: function(){
           console.log('把咖啡倒进杯子');
       },
       addCondiments: function(){
           console.log('加糖和牛奶');
       }
    });
    
    var coffee = new Coffee();
    coffee.init();

发表评论取消回复

表情：

评论列表（有 0 条评论，60人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript 23 种设计模式之 13 模板方法模式

JavaScript 23 种设计模式之 13 模板方法模式概念与特点结构与实现应用场景应用实例总结概念与特点概念：

女爷i/ 2023年03月13日 01:58/ 0 赞/ 15 阅读

相关 javaScript设计模式之模板方法模式

模板方法模式是一种只需要继承就可以实现的非常简单的模式，它定义了一个操作中的算法的骨架，而将一些步骤延迟到子类中。模板方法使得子类可以不改变一个算法的结构即可重定

﹏ヽ暗。殇╰゛Y/ 2022年09月21日 14:22/ 0 赞/ 149 阅读

相关 JavaScript模板方法模式

一、模板方法模式：一种只需使用继承就可以实现的非常简单的模式。二、模板方法模式由两部分组成，第一部分是抽象父类，第二部分是具体的实现子类。三、以设计模式中的Coffee

谁践踏了优雅/ 2022年05月27日 00:18/ 0 赞/ 61 阅读

相关模板方法模式

最近看书又遇到模板方法模式，具体是在同步器（AQS）的内容上。就顺便再来回顾下。同步器AbstractQueuedSynchronizer（AQS）是一个抽象类。其中定义了

墨蓝/ 2021年10月18日 11:34/ 0 赞/ 342 阅读

相关模板方法模式

生活中有很多按步骤才能完成的事，比如我们想进房间，需要先将门打来，然后才能进去，进去之后再把门关上。开门和关门是固定的步骤，而进入房间的步骤则不是固定的，它可以有多种方式，走着

约定不等于承诺〃/ 2021年10月15日 06:45/ 0 赞/ 381 阅读

相关模板方法模式

什么叫做模板方法模式？在定义功能时，功能的一部分是确定的但是有一部分是不确定的，而确定的部分在使用不确定的部分。那么这时就将不确定的部分暴露出来，由该类的子类去实现。

清疚/ 2021年09月18日 15:40/ 0 赞/ 414 阅读

相关 JavaScript设计模式（8）—— 模板方法模式

模板方法模式基于继承？呵呵明人不说暗话，我在看文章的时候，歪瑞讨厌看到诸如“继承”，“抽象类”，“父类子类爷爷类”之类的“非JS专用词汇”。恰巧模板方法模式上来就是一句

r囧r小猫/ 2021年09月03日 06:23/ 0 赞/ 384 阅读

相关模板方法模式

一点睛在面向对象程序设计过程中，程序员常常会遇到这种情况：设计一个系统时知道了算法所需的关键步骤，而且确定了这些步骤的执行顺序，但某些步骤的具体实现还未知，或者说某些

深藏阁楼爱情的钟/ 2021年07月24日 20:53/ 0 赞/ 463 阅读

相关 JavaScript设计模式(十四)【模板方法模式】

创建基本提示框 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT

向右看齐/ 2021年07月05日 02:18/ 0 赞/ 388 阅读

相关模板方法模式

在定义功能时，功能的一部分是确定的，一部分是不确定的，而确定的部分在使用不确定的部分，那么这时就将不确定的部分暴露出去，由该类的子类去完成。抽象类（AbstractCl...

系统管理员/ 2021年05月03日 16:24/ 0 赞/ 442 阅读