JS でオブジェクトを作成するいくつかの方法の概要

最近、『JS Advanced Programming』という本を読んでいて、オブジェクトを作成するいくつかの方法を整理する時間があります。早速、本題に入りましょう。

最初のタイプ: オブジェクト コンストラクターの作成

 Person =  Object();

このコード行は、Object 参照型の新しいインスタンスを作成し、そのインスタンスを変数 Person に保存します。

2 番目: オブジェクト リテラル表記を使用する

 Person ='Nike'29

オブジェクト リテラルはオブジェクト定義の短縮形であり、多数のプロパティを含むオブジェクトの作成プロセスを簡略化することを目的としています。つまり、オブジェクトを作成する 1 番目と 2 番目のメソッドは実際には同じですが、書き方の違いが異なります

3 番目の作成メソッドを紹介する前に、オブジェクトを作成するために他のメソッドを使用する必要がある理由を理解する必要があります。つまり、最初と 2 番目の方法には次のような欠点があります。 それらはすべて同じインターフェースを使用して多くのオブジェクトを作成するため、大量の 重複コードが生成されます。つまり、100 個のオブジェクトがある場合は、同じコードが 100 回もたくさん。では、コードの繰り返しを避けるにはどのような方法があるのでしょうか? それは、オブジェクトを作成するプロセスを関数本体にカプセル化し、関数呼び出しを通じてオブジェクトを直接生成することです。

3 番目の方法: ファクトリ モードを使用してオブジェクトを作成する

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('Nike',29,'teacher');var person2 = createPerson('Arvin',20,'student');

ファクトリ モードを使用してオブジェクトを作成すると、createperson 関数でオブジェクトが返されることに誰もが気づくでしょう。そうなると、返されたオブジェクトがどのような型であるかを判断できなくなります。したがって、オブジェクトを作成する 4 番目のモードがあります。

4つ目: コンストラクターを使用してオブジェクトを作成します

.name =.age =.job =.sayName =  person1 =  Person('Nike',29,'teacher');
var person2 = new Person('Arvin',20,'student');

ファクトリパターンを比較すると、次の違いがわかります:

1. 表示せずにオブジェクトを作成する

2. このオブジェクトに属性とメソッドを直接割り当てる

3 .No returnステートメント

4. ようやくオブジェクトの種類を認識できるようになります。オブジェクト型を検出するには、instanceof 演算子を使用して独立した検出を実行する必要があります:

alert(person1 instanceof Object);//ture
alert(person1 instanceof Person);//ture
alert(person2 instanceof Object);//ture
alert(person2 instanceof Object);//ture

同時に、慣例に従って、コンストラクターは常に大文字で始める必要があり、非コンストラクターは次の文字で始める必要があることも理解する必要があります。大文字で始めてください。

それでは、コンストラクターは確かに非常に便利ですが、欠点もあります:

つまり、各メソッドは各インスタンスで再作成する必要があり、メソッドはオブジェクトで定義した関数を参照します。メソッドの数が多いと、不必要なメモリを大量に占有します。そこで、オブジェクトを作成する 5 番目の方法があります

5 番目の方法: プロトタイプ作成オブジェクト モード

function Person(){}
Person.prototype.name = 'Nike';
Person.prototype.age = 20;
Person.prototype.jbo = 'teacher';
Person.prototype.sayName = function(){
     alert(this.name);
};var person1 = new Person();
person1.sayName();

プロトタイプを使用してオブジェクトを作成すると、すべてのオブジェクト インスタンスがそれに含まれるプロパティとメソッドを共有できるようになります。

プロトタイプを使用してオブジェクト モードを作成している場合は、次のコードを参照してください:

function Person(){}
Person.prototype.name = 'Nike';
Person.prototype.age = 20;
Person.prototype.jbo = 'teacher';
Person.prototype.sayName = function(){
     alert(this.name);
};
var person1 = new Person();
var person2 = new Person();
person1.name ='Greg';
alert(person1.name);  //'Greg'  --来自实例
alert(person2.name);  //'Nike'   --来自原型

オブジェクト インスタンスにプロパティを追加すると、このプロパティはプロトタイプ オブジェクトに保存されている同じ名前のプロパティを

シールド

します。 現時点では、コンストラクター パターンとプロトタイプ パターンを組み合わせて使用​​できます。コンストラクター パターンはインスタンス プロパティの定義に使用され、プロトタイプ パターンはメソッドと共有プロパティの定義に使用されます。

8 番目の方法: コンストラクター パターンを組み合わせます。とプロトタイプモード

function Person(name,age,job){    
    this.name =name;    
    this.age = age;    
    this.job = job;
}

Person.prototype = {
    constructor:Person,
    sayName: function(){
        alert(this.name);
    };
}var person1 = new Person('Nike',20,'teacher');

以上が8つのオブジェクト作成方法をまとめたものです、間違いがあればご指摘ください。

以上がJS でオブジェクトを作成するいくつかの方法の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。