Javascript_Design Pattern


デザインモードとは?
設計モデルはソフトウェア開発における様々なホットな問題を解決するのに役立つ検証された技術である.
この場合,このモードを用いた方向性を与えた.
1. Singleton Pattern
  • モノトーンモードは、1つの特定のカテゴリオブジェクトのみを保持するモードである.
  • 戦区からの接近を制限するために使用される.
  • const utils=(function (){
      let instance;
      
      function initialize () {
        return {
          sum : function(a,b) {
            return a+b;
          }
        };
      }
      return {
        getInstance: function () {
          if(!instance){
            instance=initialize();
          }
          return instance;
        }
      };
    })();
    
    let sum = utils.getInstance().sum(3,5);//8
    2.Factory Pattern
  • ファクトリモードは、ファクトリのように類似オブジェクトを繰り返し生成できるモードである.
  • のコンパイルでは、特定のタイプ(クラス)が分からなくても、オブジェクトを作成できます.
  • ファクトリモードの最も一般的な例は、オブジェクト()を使用してオブジェクトを作成し、所定の値タイプに基づいてString、Boolean、Numberなどのオブジェクトを生成することです.
  • const Vehicle= function(){};
    
    const Car = function() {
      this.say= function() {
        console.log('I am a car');
      }
    };
    
    const Truck = function(){
      this.say=function(){
        console.log('I am a truck');
      }
    };
    
    const Bike = function(){
      this.say=function(){
        console.log('I am a bike');
      }
    };
    const VehicleFactory = function(){
      this.createVehicle=(vehicleType)=>{
        let vehicle;
        switch(vehicleType){
          case 'car':
            vehicle = new Car();
            break;
               case 'truck':
            vehicle = new Truck();
            break;
               case 'bike':
            vehicle = new Bike();
            break;
          default:
            vehicle = new Vehicle();
            
    3.Constructor Pattern
    コンストラクション関数モードを使用すると、同じオブジェクトの複数のインスタンスをインスタンス化できます.
    let person = {};
    let person = new Object();
    function Person (name,age) {
      this.name=name;
      this.age = age;
      this.showName = () => console.log(this.name);
    }
    let person = new Person('Amy",28);
    person.showName();
    4.Prototype Pattern
    プロトタイプモードでは、プロトタイプからオブジェクトの新しいインスタンスをコピーします.新しいオブジェクトの作成者を直接作成すると、複雑で非効率になる可能性があります.そのため、プロトタイプは補完できます.
    function Book(title,price) {
      this.title=title;
      this.price=price;
      this.printTitle = () =>console.log(this.title);
    }
    function BookPrototype(prototype){
      this.prototype=prototype;
      this.clone=()=>{
        let book = new Book();
        book.title = prototype.title;
        book.price = prototype.price;
        
        return book;
      };
    }
    let sampleBook = new Book ('JavaScript',15);
    let prototype = new BookProtoType(sampleBook);
    let book = prototype.clone();
    book.printTitle();
    Javascriptには独自の組み込みプロトコルタイプ機能があるため、以下の方法でこのモードを有効に使用できます.
    let book = {
      title : 'Javascript',
      price:15
    }
    let anotherBook = Object.assign({},book);
    5.Observer Pattern
    Observerモードは、イベントが発生すると通知されるサブスクリプション・イベントのサブスクリプション・モードを提供します.
    function Newsletter(){
      this.observers=[];
    }
    Newsletter.prototype ={
      subscribe: function (observer) {
        this.observers.push(observer);
      },
      unsubscribe: function (observer){
        this.observers = this.observers.filter(ob => ob !== observer);
      },
      notify:function(){
        this.observers.forEach(observer =>console.log('Hello' + observer.toString()));
      }
    }
    
    6.Module Pattern
    モジュールモードは、ソフトウェアモジュールの概念を体現するための設計モードである.このモードでは、より安全なアプリケーションを作成し、コードをカプセル化できます.
    const bookModule=(function() {
      //private
      let title='Javascript';
      let price=15;
      //public
      return {
        printTitle: function() {
          console.log(title);
        }
      }
    })();
    bookModule.printTitle();
    注意:https://sangcho.tistory.com/entry/%EC%9B%B9%EA%B0%9C%EB%B0%9C%EC%9E%90%EA%B0%80%EC%95%8C%EC%95%84%EC%95%BC%ED%95%A07%EA%B0%80%EC%A7%80%EB%94%94%EC%9E%90%EC%9D%B8%ED%8C%A8%ED%84%B4