Learning the template method mode and JavaScript design mode of the javascript Design Mode

Learning the template method mode and JavaScript design mode of the javascript Design Mode

I. Definition

The template method is based on the inherited design pattern, which can improve the scalability of the system. Abstract parent class and Child class in java
The template method consists of two parts: the first part is the abstract parent class, and the second part is the concrete implementation subclass.

Ii. Example

Coffee or Tea
(1) boil the water
(2) tea leaves soaked in boiling water
(3) Pour tea into the cup
(4) add Lemon

/* Abstract parent class: Beverage */var Beverage = function () {}; // (1) boil the water to Beverage. prototype. boilWater = function () {console. log ("boil water") ;}; // (2) soak Beverage in boiling water. prototype. brew = function () {throw new Error ("the brew method must be rewritten in the subclass") ;}; // (3) pour it into the cup Beverage. prototype. pourInCup = function () {throw new Error ("The subclass must override the pourInCup method") ;}; // (4) Add the seasoning Beverage. prototype. addCondiments = function () {throw new Error ("subclass must override addCondiments method") ;};/* Template Method */Beverage. prototype. init = function () {this. boilWater (); this. brew (); this. pourInCup (); this. addCondiments () ;}/ * Implementation subclass Coffee */var Coffee = function () {}; Coffee. prototype = new Beverage (); // rewrite the Non-Public method Coffee. prototype. brew = function () {console. log ("brewed Coffee with boiling water") ;}; Coffee. prototype. pourInCup = function () {console. log ("pour Coffee into a cup") ;}; Coffee. prototype. addCondiments = function () {console. log ("milk") ;}; var coffee = new Coffee (); coffee. init ();

The template method mode encapsulates the subclass Algorithm Framework in the parent class. These algorithm frameworks are applicable to most child classes under normal conditions, but there will also be child classes of "personality.
As shown in the preceding process, seasoning is optional.
The Hook method can solve this problem. Placing a hook is a common means of isolating changes.

/* Add the hook Method */Beverage. prototype. customerWantsCondiments = function () {return true ;}; Beverage. prototype. init = function () {this. boilWater (); this. brew (); this. pourInCup (); if (this. customerWantsCondiments () {this. addCondiments () ;}/ * sub-class Tea */var Tea = function () {}; Tea. prototype = new Beverage (); // rewrite the Non-Public method Tea. prototype. brew = function () {console. log ("brewed Tea with boiling water") ;}; Tea. prototype. pourInCup = functio N () {console. log ("Pour Tea into Cup") ;}; Tea. prototype. addCondiments = function () {console. log ("milk") ;}; Tea. prototype. customerWantsCondiments = function () {return window. confirm ("do I need to add spices? ") ;}; Var tea = new Tea (); tea. init ();

JavaScript does not provide true class inheritance. inheritance is implemented through delegation between objects.

3. Hollywood principles: Don't call us. We will call you.

Typical use cases:

(1) template method mode:Using this design pattern means that the subclass gives up control of itself, but changes to the parent class notification subclass. As a subclass, it is only responsible for providing some design details.
(2) Observer mode:The publisher pushes messages to the subscriber.
(3) callback function:Ajax asynchronous requests encapsulate the operations to be executed in the callback function. After the data is returned, the callback function is executed.

I hope this article will help you learn about javascript programming.

Articles you may be interested in:

• C # Template Method Pattern example tutorial
• C ++ design mode: Template Method Mode
• Learning php design mode php implementation template method mode