ホームページ  >  記事  >  ウェブフロントエンド  >  オブジェクトを作成するための 7 つの JS オブジェクト指向メソッド

オブジェクトを作成するための 7 つの JS オブジェクト指向メソッド

零到壹度
零到壹度オリジナル
2018-03-22 16:31:061312ブラウズ

この記事では、主に 7 つの JS オブジェクト指向オブジェクトの作成について詳しく説明します。お役に立てれば幸いです。

1. ファクトリ パターン
ECMAScript ではクラスを作成できないことを考慮して、開発者は特定のインターフェイスでオブジェクトを作成する詳細をカプセル化する関数を発明しました:

function createPerson(name,age,job){
    var o = new Object();  
      o.name = name;  
      o.age = age;
      o.job = job;  
      o.sayName = function(){  
            alert(this.name);
    }; 
    return o;
}
var person1 = createPerson("Joy",29,"Software Engineer");
var person2 = createPerson("Greg",27,"Doctor");

2. コンストラクター パターン

function Person(name,age,job){  
  this.name = name;  
   this.age = age;  
     this.job = job; 
        this.sayName = function(){   
             alert(this.name);
    }
}
var person1 = new Person("Joy",29,"Software Engineer");
var person2 = new Person("Greg",27,"Doctor");
alert(person1.sayName === person2.sayName); //false.每个Person实例都会创建一个功能相同的Function实例

3.作成された関数にはプロトタイプ属性があります。この属性はオブジェクトを指すポインターであり、このオブジェクトの目的は、特定の型で共有できるプロパティとメソッドを含めることです。プロトタイプ オブジェクトを使用する利点は、すべてのオブジェクト インスタンスがそれに含まれるプロパティとメソッドを共有できることです

function Person(){}
    Person.prototype.name = "Joy";
    Person.prototype.age = 29;
    Person.prototype.job = "Software Engineer";
    Person.prototype..sayName = function(){ 
  alert(this.name)
};
  var person1 = new Person();

4. コンストラクター パターンとプロトタイプ パターンを組み合わせて使用​​します

 function Person(name,age,job){  
    this.name = name;   
     this.age = age;    
     this.job = job;
}
   Person.prototype = { 
      sayName:function(){     
         alert(this.name)
    }
};
   var person1 = new Person("Joy",29,"Software Engineer");
   var person2 = new Person("Greg",27,"Doctor");
   alert(person1.sayName === person2.sayName); //true

5. 動的プロトタイプ パターン

 function Person(name,age,job){   
    this.name = name;    
    this.age = age;    
    this.job = job;    
    if(typeof this.sayName != 'function'){  
          console.log(this.name); //在下了person1、person2两个实例下只会输出Joy,不会输出Greg   
          Person.prototype.sayName = function(){ //这里只在sayName()方法不存在的情况下,才会将它添加到原型中。这段代码只会在初次调用构造函数是才会执行。            alert(this.name)
        }
    }
}
  var person1 = new Person("Joy",29,"Software Engineer");var person2 = new Person("Greg",27,"Doctor");


6 、Parasite Pattern

   function Person(name,age,job){   
    var o = new Object();    
    o.name = name;    
    o.age = age;    
    o.job = job;    
    o.sayName = function(){        
        alert(this.name);
    };
        return o;
}
var person1 = new Person("Joy",27,"Software Engineer");

Parasite Pattern によって返されるオブジェクトは、コンストラクターまたはコンストラクターのプロトタイプ プロパティとは何の関係もありません。つまり、コンストラクターによって返されるオブジェクトは、コンストラクターの外部で作成されたオブジェクトと何ら変わりません。 。このため、他のモードが使用できる場合は、このモードを使用しないことをお勧めします

7. 安全なコンストラクター モード
いわゆる安全とは、パブリック プロパティがなく、そのメソッドがこのオブジェクトを参照しないことを意味します。安全なコンストラクターは寄生コンストラクターと同様のパターンに従いますが、2 つの違いがあります。まず、新しく作成されたオブジェクト インスタンス メソッドはこれを参照せず、代わりに new 演算子を使用してコンストラクターを呼び出しません。

function Person(name,age,job){   
 var o = new Object();    
   o.sayName = function(){     
      alert(name)
    }; 
       return o;
}
var person1 = Person("Joy",29,"Software Engineer");

このように、変数 person1 は安定したオブジェクトであり、sayName() メソッド以外にそのデータ メンバーにアクセスする方法はありません。他のコードがこのオブジェクトにメソッドやデータ メンバーを追加したとしても、コンストラクターに渡された元のデータにアクセスする他の方法はありません。


以上がオブジェクトを作成するための 7 つの JS オブジェクト指向メソッドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。