typescript: Template Method pattern

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163

/**  * Template Method pattern 模版方法是一种行为设计模式， 它在基类中定义了一个算法的框架， 允许子类在不修改结构的情况下重写算法的特定步骤。  * file: Templatets.ts  * The Abstract Class defines a template method that contains a skeleton of some  * algorithm, composed of calls to (usually) abstract primitive operations.  *  * Concrete subclasses should implement these operations, but leave the template  * method itself intact.  */ abstract class AbstractClass {         /**      * The template method defines the skeleton of an algorithm.      *      * @param strinuput      * @returns      */     public templateMethod(strinuput:string): string { //void         let getstr="";         this.baseOperation1();         getstr=this.requiredOperations1(strinuput);         this.baseOperation2();         this.hook1();         this.requiredOperation2(strinuput);         this.baseOperation3();         this.hook2();         return getstr;     }       /**      * These operations already have implementations.      */     protected baseOperation1(): void {         console.log('AbstractClass says: I am doing the bulk of the work');     }     /**      *      */     protected baseOperation2(): void {         console.log('AbstractClass says: But I let subclasses override some operations');     }     /**      *      */     protected baseOperation3(): void {         console.log('AbstractClass says: But I am doing the bulk of the work anyway');     }       /**      * These operations have to be implemented in subclasses.      * @param strinuput      * @returns      */     protected abstract requiredOperations1(strinuput:string):string; //void       /**      *      * @param strinuput      */     protected abstract requiredOperation2(strinuput:string): void;       /**      * These are "hooks." Subclasses may override them, but it's not mandatory      * since the hooks already have default (but empty) implementation. Hooks      * provide additional extension points in some crucial places of the      * algorithm.      */     protected hook1(): void { }     /**      *      */     protected hook2(): void { } }   /**  * Concrete classes have to implement all abstract operations of the base class.  * They can also override some operations with a default implementation.  */ class ConcreteClass1 extends AbstractClass {       /**      *      * @param strinuput      * @returns      */     protected requiredOperations1(strinuput:string):string { //void         console.log('ConcreteClass1 says: Implemented Operation1,'+strinuput);         return 'ConcreteClass1 says: Implemented Operation1,'+strinuput;       }     /**      *      * @param strinuput      */     protected requiredOperation2(strinuput:string): void {         console.log('ConcreteClass1 says: Implemented Operation2,'+strinuput);     } }   /**  * Usually, concrete classes override only a fraction of base class' operations.  */ class ConcreteClass2 extends AbstractClass {       /**      *      * @param strinuput      * @returns      */     protected requiredOperations1(strinuput:string): string { //void         console.log('ConcreteClass2 says: Implemented Operation1,'+strinuput);         return 'ConcreteClass2 says: Implemented Operation1,'+strinuput;     }     /**      *      * @param strinuput      */     protected requiredOperation2(strinuput:string): void {         console.log('ConcreteClass2 says: Implemented Operation2,'+strinuput);     }     /**      *      */     protected hook1(): void {         console.log('ConcreteClass2 says: Overridden Hook1');     } }   let pubTemplate1=""; let pubTemplate2=""; let pubTemplate3="Geovin Du"; let pubTemplate4="geovindu";     /**  * The client code calls the template method to execute the algorithm. Client  * code does not have to know the concrete class of an object it works with, as  * long as it works with objects through the interface of their base class.  * 客户端显示  * @param abstractClass  * @param strinput  */ function clientCodeTemplate(abstractClass: AbstractClass,strinput:string) {     // ...    return abstractClass.templateMethod(strinput);     // ... }         console.log('Same client code can work with different subclasses:');   pubTemplate1=clientCodeTemplate(new ConcreteClass1(),"geovindu");   console.log('');   console.log('Same client code can work with different subclasses:'); pubTemplate2=clientCodeTemplate(new ConcreteClass2(),"geovindu");   let messageTemplate: string = 'Hello World,This is a typescript!,涂聚文 Geovin Du.Web'; document.body.innerHTML = messageTemplate+",<br/>one="+pubTemplate1+",<br/>two="+pubTemplate2+",<br/>three="+pubTemplate3+",<br/>four="+pubTemplate4+",<br/>TypeScript Template Method pattern 模版模式";

　　

调用：

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

<!doctype html> <html lang="en"> <head>   <meta charset="UTF-8">   <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">   <meta http-equiv="X-UA-Compatible" content="ie=edge">     <head><title>TypeScript Hello Template Method pattern 模版模式</title>       <meta name="Description" content="geovindu,涂聚文,Geovin Du"/> <meta name="Keywords" content="geovindu,涂聚文,Geovin Du"/> <meta name="author" content="geovindu,涂聚文,Geovin Du"/>     </head>     <body>         <script src="dist/Templatets.js"></script>     </body> </html>

　　

 

输出：