🔥 [Design pattern] Template method pattern

This is the 12th day of my participation in the August Challenge

In the process of object-oriented programming, we often mention refactoring, extracting and encapsulating some repeated codes, because repeated codes to a certain extent will cause errors in coding and difficult to maintain after coding.

Please write down the questions by hand.

We use the original method to copy two copies of the test and give them to the teacher

Copy paper 01 by hand

class Paper01 {
  constructor() {
    console.log("= = = = = = = = = = paper 01 = = = = = = = = = =");
  }

  question1(): void {
    console.log("Title 01: The moon is shining before the window. Next?");
    console.log("Answer:"."Suspected frost on the ground.");
  }

  question2(): void {
    console.log("Question 02: Goose, goose, goose, next?");
    console.log("Answer:"."Song to the sky.");
  }

  question3(): void {
    console.log("Topic 02: The wind and the waves will sometimes, next sentence?");
    console.log("Answer:"."Sail straight to the sea."); }}Copy the code

Copy paper 02 by hand

class Paper02 {
  constructor() {
    console.log("= = = = = = = = = = paper 02 = = = = = = = = = =");
  }
  question1(): void {
    console.log("Title 01: The moon is shining before the window. Next?");
    console.log("Answer:"."Suspected frost on the ground.");
  }
  question2(): void {
    console.log("Question 02: Goose, goose, goose, next?");
    console.log("Answer:"."Song to the sky.");
  }
  question3(): void {
    console.log("Title 03: a piece of magnetic needle stone in my heart. Next?");
    console.log("Answer:"."We won't rest until we have a guide."); }}Copy the code

To hand in the answer

const paper01 = new Paper01();
paper01.question1();
paper01.question2();
paper01.question3();
const paper02 = new Paper02();
paper02.question1();
paper02.question2();
paper02.question3();
Copy the code

instructions

As can be seen from the above practice, the third question in paper 02 seems to have been copied wrong, and the two papers should have the same question except for the difference in answers. If the teacher needs to revise the question, each student should copy it again together.

The teacher prepared an examination paper

The examination paper that the teacher marked for us helped to unify our subjects

The examination paper template

class PaperBase {
  question1(): void {
    console.log("Title 01: The moon is shining before the window. Next?");
  }

  question2(): void {
    console.log("Question 02: Goose, goose, goose, next?");
  }

  question3(): void {
    console.log("Topic 02: The wind and the waves will sometimes, next sentence?"); }}Copy the code

Revise papers 01 and 02

// Test 02 is identical to test 01
class Paper01 extends PaperBase {
  constructor() {
    super(a);console.log("= = = = = = = = = = paper 01 = = = = = = = = = =");
  }

  question1(): void {
    super.question1();
    console.log("Answer:"."Suspected frost on the ground.");
  }

  question2(): void {
    super.question2();
    console.log("Answer:"."Song to the sky.");
  }

  question3(): void {
    super.question3();
    console.log("Answer:"."Sail straight to the sea."); }}Copy the code

instructions

By inheriting test papers 01 and 02 from the Base version, our problem is easy to make mistakes. However, there are still a lot of repeated content in our test papers 01 and 02 can also be extracted into the parent class, so that our subclass can only retain the incompatibility, and make full use of our parent class.

Introduce the template method pattern

When we want to accomplish a process or series of steps at a consistent level of detail, but individual steps may be implemented differently at a more detailed level, we usually consider the template approach pattern. “– [Big Talk Design Pattern] page 94

Basic Paper 2.0

abstract class PaperBase {
  question1(): void {
    console.log("Title 01: The moon is shining before the window. Next?");
    console.log("Answer:".this.answer1());
  }

  question2(): void {
    console.log("Question 02: Goose, goose, goose, next?");
    console.log("Answer:".this.answer2());
  }

  question3(): void {
    console.log("Topic 02: The wind and the waves will sometimes, next sentence?");
    console.log("Answer:".this.answer3());
  }

  abstract answer1(): string;
  abstract answer2(): string;
  abstract answer3(): string;
}
Copy the code

Revise papers 01 and 02 again

class Paper01 extends PaperBase {
  answer1(): string {
    return "Suspected frost on the ground.";
  }
  answer2(): string {
    return "Song to the sky.";
  }
  answer3(): string {
    return "Sail straight to the sea."; }}Copy the code

instructions

Through the template method mode, our test papers 01 and 02 only have their own answers, which completes another transformation.

Template method pattern

Define an algorithm skeleton in an operation, deferring some steps to subclasses. The template method allows subclasses to implement specific steps to redefine an algorithm without changing its structure.