好程序员web前端教程分享js模板模式

什么是模板模式？

 

模板模式是抽象父类定义了子类需要重写的相关方法。 而这些方法，仍然是通过父类方法调用的。   根据描述， “模板”的思想体现在：父类定义的接口方法。 除此之外，子类方法的调用，也是被父类控制的。

 

 

应用场景

 

   一些系统的架构或者算法骨架，由 “ BOSS ”编写抽象方法，具体的实现，交给“小弟们”实现。 而绝对是不是用“小弟们”的方法，还是看“ BOSS ”的心情。 不是很恰当的比喻哈 ~

 

 

ES6 实现

 

Animal 是抽象类， Dog 和 Cat 分别具体实现了 eat() 和 sleep() 方法。 Dog 或 Cat 实例可以通过 live() 方法调用 eat() 和 sleep() 。

 

  注意： Cat 和 Dog 实例会被自动添加 live() 方法。不暴露 live() 是为了防止 live() 被子类重写，保证父类的控制权。

 

class Animal {

  constructor() {

    // this 指向实例

    this.live = () => {

      this.eat();

      this.sleep();

    };

  }

 

  eat() {

    throw new Error(" 模板类方法必须被重写 ");

  }

 

  sleep() {

    throw new Error(" 模板类方法必须被重写 ");

  }

}

 

class Dog extends Animal {

  constructor(...args) {

    super(...args);

  }

  eat() {

    console.log(" 狗吃粮 ");

  }

  sleep() {

    console.log(" 狗睡觉 ");

  }

}

 

class Cat extends Animal {

  constructor(...args) {

    super(...args);

  }

  eat() {

    console.log(" 猫吃粮 ");

  }

  sleep() {

    console.log(" 猫睡觉 ");

  }

}

 

/********* 以下为测试代码 ********/

 

// 此时 , Animal 中的 this 指向 dog

let dog = new Dog();

dog.live();

 

// 此时 , Animal 中的 this 指向 cat

let cat = new Cat();

cat.live();

来自 “ ITPUB博客 ” ，链接：http://blog.itpub.net/69913892/viewspace-2641196/，如需转载，请注明出处，否则将追究法律责任。

转载于:http://blog.itpub.net/69913892/viewspace-2641196/