Erlernen Sie die Fähigkeiten der JavaScript-Entwurfsmuster-Vorlagenmethode „pattern_javascript“.

1. Definition

Die Vorlagenmethode basiert auf dem Vererbungsentwurfsmuster, das die Skalierbarkeit des Systems erheblich verbessern kann. Abstrakte übergeordnete Klasse und Unterklasse in Java
Die Vorlagenmethode besteht aus zwei Teilen der Struktur: Der erste Teil ist die abstrakte übergeordnete Klasse und der zweite Teil ist die konkrete Implementierungsunterklasse.

2. Beispiel

Kaffee oder Tee
(1) Wasser kochen
(2) Teeblätter in kochendem Wasser einweichen
(3) Gießen Sie den Tee in die Tasse
(4) Zitrone hinzufügen

/* 抽象父类：饮料 */
var Beverage = function(){};
// (1) 把水煮沸
Beverage.prototype.boilWater = function() {
  console.log("把水煮沸");
};
// (2) 沸水浸泡
Beverage.prototype.brew = function() {
  throw new Error("子类必须重写brew方法");
};
// (3) 倒进杯子
Beverage.prototype.pourInCup = function() {
  throw new Error("子类必须重写pourInCup方法");
};
// (4) 加调料
Beverage.prototype.addCondiments = function() {
  throw new Error("子类必须重写addCondiments方法");
};

/* 模板方法 */
Beverage.prototype.init = function() {
  this.boilWater();
  this.brew();
  this.pourInCup();
  this.addCondiments();
}

/* 实现子类 Coffee*/
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();

Mithilfe des Vorlagenmethodenmusters wird das Algorithmus-Framework der Unterklasse in der übergeordneten Klasse gekapselt. Diese Algorithmus-Frameworks sind unter normalen Bedingungen für die meisten Unterkategorien geeignet, es werden jedoch auch Unterkategorien „Persönlichkeit“ angezeigt.
Wie im obigen Prozess ist das Hinzufügen von Gewürzen optional.
Die Hook-Methode kann dieses Problem lösen. Das Platzieren von Hooks ist ein gängiges Mittel zum Isolieren von Änderungen.

/* 添加钩子方法 */
Beverage.prototype.customerWantsCondiments = function() {
  return true;
};
Beverage.prototype.init = function() {
  this.boilWater();
  this.brew();
  this.pourInCup();
  if(this.customerWantsCondiments()) {
    this.addCondiments();
  }
}

/* 实现子类 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("加牛奶");
};
Tea.prototype.customerWantsCondiments = function() {
  return window.confirm("需要添加调料吗？");
};
var tea = new Tea();
tea.init();

JavaScript bietet keine echte Klassenvererbung durch Delegation zwischen Objekten.

3. „Hollywood-Prinzip“: Rufen Sie uns nicht an, wir rufen Sie an

Typische Nutzungsszenarien:

(1) Vorlagenmethodenmuster: Die Verwendung dieses Entwurfsmusters bedeutet, dass die Unterklasse die Kontrolle über sich selbst aufgibt und stattdessen die Unterklasse durch die übergeordnete Klasse informiert. Als Unterklasse ist sie nur für die Bereitstellung einiger Designdetails verantwortlich.
(2) Beobachtermodus: Der Herausgeber leitet die Nachricht an die Abonnenten weiter.
(3) Rückruffunktion: Eine asynchrone Ajax-Anfrage kapselt die Vorgänge, die in der Rückruffunktion ausgeführt werden müssen. Diese Rückruffunktion wird nur ausgeführt, wenn die Daten zurückgegeben werden.

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die JavaScript-Programmierung lernen.