《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();