ホームページ > 記事 > ウェブフロントエンド > JavaScript のオブジェクトとプロトタイプ (1)
One Factory Pattern
オブジェクトを作成するには、次のコードを使用できることがわかります:
var user = new Object(); //使用new运算符创建一个对象 user.name = '念在三角湖畔'; //给对象添加属性 user.age = 22; user.address = '湖北武汉'; alert(user.name + " " +user.age);//返回 '念在三角湖畔 湖北武汉'
この方法でオブジェクトを作成するのは比較的シンプルで直感的であり、JavaScript でオブジェクトを作成する最も基本的な方法でもあります。しかし、複数のオブジェクトを作成する必要がある場合、多くのコードを繰り返し記述しなければならないという問題があります。たとえば、別のオブジェクト user1 を作成する場合、上記のコードを書き直す必要があります。これは、オブジェクトが多すぎるとコード量が大幅に増加するため、実際の開発プロセスでは適切ではありません。
このような問題を解決するには、ファクトリパターンと呼ばれる方法を使用できます。この方法は、重複コードが大量に生成されるオブジェクトのインスタンス化の問題を解決します。
function create(name, age) { var obj = new Object(); obj.name = name; obj.age = age; obj.run = function () { return this.name +' '+ this.age; }; return obj; } var obj1= create('ZXC', 10); //第一个实例 var obj2= create('CXZ', 20); //第二个实例 alert(obj1.run()); alert(obj1.run());
上記のコードから、ファクトリ パターンがインスタンス化中の大量のコード重複の問題を解決していることがわかりますが、別の問題が発生します。つまり、どのオブジェクトがインスタンスであるかを単純に把握できないということです。の。例:
alert(typeof obj1); //Object alert(obj1 instanceof Object); //true
上記のコードは、box1 が Object オブジェクトであることを示していますが、どのオブジェクトが作成されたのかはわかりません。
2 コンストラクター(コンストラクターメソッド)
上記の問題を解決するには、コンストラクターメソッドを使用してオブジェクトを作成できます。コンストラクターと通常の関数の唯一の違いは、その呼び出し方法です。ただし、コンストラクターも関数です。
function User(name, age) { //构造函数模式 this.name = name; this.age = age; this.run = function () { return this.name + ' '+this.age; }; }
オブジェクトを作成するときに new 演算子を使用するだけです:
var user1= new User('ZXC', 25); var user2= new User('CXZ', 22);
これで、user1 または user2 が User に属しているかどうかを検出できるようになりました。
alert(user1 instanceof User);//true
コンストラクターメソッドを使用すると、インスタンス化の繰り返しの問題が解決されるだけでなく、オブジェクト認識の問題も解決されることがわかります。
コンストラクタを使用する際に実行される処理は次のとおりです:
1. newコンストラクタ()を実行すると、バックグラウンドでnew Object()が実行されます
2.コンストラクタのスコープをnewコンストラクタに与える物体。
3. コンストラクターでコードを実行します。
4. 新しいオブジェクトをバックグラウンドで直接返します。
次に、コンストラクター内の関数の問題を見てみましょう。次のステートメントを実行すると:
alert(user1.run==user2.run);//结果返回的是false
結果は false を返します。これは、メソッドが実際には参照アドレスであることを意味します。複数のオブジェクトを繰り返し作成すると、各オブジェクトのメソッドによってメモリ内に新しい領域が空き、より多くの領域が無駄になります。この問題を解決するには、インスタンスの属性またはメソッドの共有を使用する必要があります。この問題の解決については、次の記事で引き続き説明します。
上記は JavaScript のオブジェクトとプロトタイプの内容です (1)。さらに関連する内容については、PHP 中国語 Web サイト (www.php.cn) に注目してください。