23のデザインパターンのJavaScript22メモモード

コンセプトと特徴

概念:
メモモードとは、オブジェクトのカプセル化を破壊せずにオブジェクトの内部状態をキャプチャして保存し、必要に応じて元の状態に復元できるようにすることです。

特徴:

  1. 状態を復元するメカニズムを提供し、ユーザーが必要なときに特定の履歴状態に簡単に復元できます。
  2. 内部状態のカプセル化が実現されますが、それを作成したイニシエーターを除いて、他のオブジェクトは状態情報にアクセスできません。
  3. イニシエーターを簡略化しました。イニシエーターは、内部状態の個々のバックアップを管理および保存する必要はありません。すべてのステータス情報はメモに保存され、単一の責任の原則に従ってマネージャーによって管理されます。
  4. 欠点は、メモリ消費量が多いことです。内部状態が多すぎると、比較的大きなメモリリソースを消費します。

構造と実現

構造:
メモモードには、イニシエーター、メモ、マネージャーが含まれます。
イニシエーター:現在の状態情報を記録し、メモの作成とメモデータの復元の機能を提供し、メモ内のすべての情報にアクセスできます。
メモ:イニシエーターの内部ステータスを保存し、必要に応じてイニシエーターにステータスを提供する責任があります。
マネージャー:メモを管理し、メモを保存および取得する機能を提供しますが、メモの内容にアクセスしたり変更したりすることはできません。

ケース
機能説明:ミニ冷蔵庫に保管できる果物は3つだけです。果物が3つ以上ある場合は、最後に保管した果物を保管順序に従って取り出してから保管することができます。たとえば、梨、リンゴ、バナナは別々に保管されます。桃を保存したいのなら、それはできません。最後に保管したフルーツバナナを取り出して初めて桃を保管できます。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>React App</title>
</head>
<body>
<script>
class Person{
    
    
     constructor(){
    
    
         this.fruitName = "";
     }
     getFruitName(){
    
    
         return this.fruitName;
     }
     setFruitName(fruitName){
    
    
         this.fruitName = fruitName;
     }
     createFruit(){
    
    
         return new Fruit(this.fruitName);
     }
     restoreFruit(){
    
    
        this.setFruitName((new Fruit).getName());
     }
}
class Fruit{
    
    
    constructor(name){
    
    
        this.name = name;
    }
    getName(){
    
    
        return this.name;
    }
    setName(name){
    
    
        this.name = name;
    }
}
 class Manager{
    
    
      constructor(){
    
    
          this.fruit = new Fruit();
          this.top = 0;
      }
      push(f){
    
    
          this.fruit[this.top] = f;
          if(this.top>=3){
    
    
              console.log("已达上限,不能储存"+f.getName());
              return false
          }else {
    
    
              console.log("储存了"+f.getName());
              this.top++;
              return true
          }
      }
      pop(){
    
    
          this.top--;
          let f = this.fruit[this.top];
          if(this.top <= 0){
    
    
              console.log("撤回最后一个"+f.getName())
          }else {
    
    
              console.log("撤回了"+f.getName())
          }
      }
  }
class Customer{
    
    
    static main(){
    
    
        let p = new Person();
        let m = new Manager();
        p.setFruitName("梨子");
        m.push(p.createFruit());//保存备忘录

        p.setFruitName("苹果");
        m.push(p.createFruit());//保存备忘录

        p.setFruitName("香蕉");
        m.push(p.createFruit());//保存备忘录

        p.setFruitName("桃子");
        m.push(p.createFruit());//保存备忘录,不能存了,已存满

        p.restoreFruit(m.pop());//恢复状态
        p.restoreFruit(m.pop());//恢复状态
        p.restoreFruit(m.pop());//恢复状态

        p.setFruitName("桃子");//又可以存了
        m.push(p.createFruit());//保存备忘录
    }
}
Customer.main();
</script>
</body>
</html>

アプリケーションシナリオ

  1. データシーンを保存および復元する必要があります。
  2. 操作をロールバックできるシナリオを提供する必要があります。

アプリケーション

上記の場合を参照してください。

総括する

メモモードは元に戻す操作に非常に適しています。たとえば、エディターで誤ってコードを記述しましたが、元の時間に戻したい場合は、元に戻すを使用して元に戻すことができます。

[イニシエーター]:
1。独自のステータスを設定および取得し、メモを作成および復元します。
2. createFruitメソッドを指定してメモを作成し、状態をパラメーターとしてメモをインスタンス化し、メモの状態として返します。
3.メモを復元するためのrestoreFruitメソッドを提供します。現在のメモの状態を渡し、独自のsetメソッドを呼び出して状態を設定します。

【メモ】
1。メモのステータスを設定および取得する方法を提供します。

[マネージャー]:
1。メモを管理し、メモを初期化し、現在の順序を初期化します。
2.現在のステータスをメモに追加するためのpushメソッドを
提供します。3。メモから最後の操作ステータスを取得するためのpopメソッドを提供します。

おすすめ

転載: blog.csdn.net/weixin_44135121/article/details/106017663