《JavaScript設計模式與開發實踐》讀書筆記之模板方法模式

標籤：

1. 模板方法模式1.1 物件導向方式實現模板方法模式

以泡茶和泡咖啡為例，可以整理為下面四步

• 把水煮沸
• 用沸水沖泡飲料
• 把飲料倒進杯子
• 加調料

首先建立一個抽象父類來表示泡一杯飲料

var Beverage=function(){};Beverage.prototype.boilWater=function(){    console.log(‘把水煮沸‘);};Beverage.prototype.brew=function(){};//空方法，由子類重寫Beverage.prototype.pourInCup=function(){};//空方法，由子類重寫Beverage.prototype.addCondiments=function(){};//空方法，由子類重寫Beverage.prototype.init=function(){    this.boilWater();    this.brew();    this.pourInCup();    this.addCondiments();};

接下來建立Coffee子類和Tea子類

var Coffee=function(){};Coffee.prototype=new Beverage();

重寫父類的抽象方法

Coffee.prototype.brew=function(){    console.log(‘用沸水沖泡咖啡‘);};Coffee.prototype.pourInCup=function(){    console.log(‘把咖啡倒進杯子‘);};Coffee.prototype.addCondiments=function(){    console.log(‘加糖和牛奶‘);};var Coffee=new Coffee();Coffee.init();

繼續建立Tea類

var Tea=function(){};Tea.prototype=new Beverage();Tea.prototype.brew=function(){    console.log(‘用沸水浸泡茶葉‘);};Tea.prototype.pourInCup=function(){    console.log(‘把茶倒進杯子‘);};Tea.prototype.addCondiments=function(){    console.log(‘加檸檬‘);};var tea=new Tea();tea.init();

上例中，Beverage.prototype.init是模板方法，方法中封裝了子類的演算法架構
它作為一個演算法的模板，指導子類以何種順序去執行哪些方法

1.2 Javascript中的模板方法模式

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 Tea=Beverage(    {        brew:function(){            console.log(‘用沸水浸泡茶葉‘);        },        pourInCup:function(){            console.log(‘把茶倒進杯子‘);        },        addCondiments:function(){            console.log(‘加檸檬‘);        }    });var coffee=new Coffee();coffee.init();var tea=new Tea();tea.init();

《JavaScript設計模式與開發實踐》讀書筆記之模板方法模式