JavaScript デザイン パターン テンプレート メソッド pattern_javascript スキルを学ぶ

1. 定義

テンプレート メソッドは継承設計パターンに基づいており、システムのスケーラビリティを大幅に向上させることができます。 Java の抽象親クラスとサブクラス
テンプレート メソッドは構造の 2 つの部分で構成されます。最初の部分は抽象親クラスで、2 番目の部分は具象実装サブクラスです。

2. 例

コーヒーまたは紅茶
(1) 水を沸騰させる
(2) 茶葉を熱湯に浸す
(3) 紅茶をカップに注ぎます
(4)レモンを加える

/* 抽象父类：饮料 */
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();

テンプレート メソッド パターンを使用して、サブクラスのアルゴリズム フレームワークが親クラスにカプセル化されます。これらのアルゴリズム フレームワークは、通常の状況ではほとんどのサブカテゴリに適していますが、「性格」サブカテゴリも表示されます。
上記のプロセスと同様に、調味料の追加はオプションです。
フック メソッドは、この問題を解決できます。フックを配置することは、変更を分離する一般的な手段です。

/* 添加钩子方法 */
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 は、オブジェクト間の委任によって真のクラス継承を実現しません。

3. 「ハリウッドの原則」: 電話をかけないでください。私たちが電話します

一般的な使用シナリオ:

(1) テンプレート メソッド パターン: このデザイン パターンを使用すると、サブクラスは自身の制御を放棄し、代わりにサブクラスを親クラスに通知します。サブクラスとして、これは一部の設計の詳細を提供することのみを担当します。
(2) オブザーバー モード: パブリッシャーはメッセージをサブスクライバーにプッシュします。
(3) コールバック関数: ajax 非同期リクエストは、コールバック関数で実行する必要がある操作をカプセル化します。このコールバック関数は、データが返されたときにのみ実行されます。

この記事が、JavaScript プログラミングを学習する皆さんのお役に立てれば幸いです。