JavaScript のクラスとオブジェクトの簡単な分析

1.コンストラクターメソッド
これは古典的なメソッドであり、教科書で必ず教えられるメソッドです。コンストラクターを使用して「クラス」をシミュレートし、内部で this キーワードを使用してインスタンス オブジェクトを参照します。

　function Cat() {
　　　　this.name = "大毛";
　　}

インスタンスを生成するときは、new キーワードを使用します。

　var cat1 = new Cat();
　　alert(cat1.name); // 大毛

クラスの属性とメソッドは、コンストラクターのプロトタイプ オブジェクトで定義することもできます。

　　Cat.prototype.makeSound = function(){
　　　　alert("喵喵喵");
　　}

このメソッドの詳細な紹介については、私が書いた一連の記事「Javascript オブジェクト指向プログラミング」を参照してください。ここでは詳しく説明しません。その主な欠点は、比較的複雑で、this とプロトタイプを使用し、書くのも読むのも非常に手間がかかることです。
2. Object.create() メソッド
「コンストラクターメソッド」の欠点を解決し、より便利にオブジェクトを生成するために、JavaScript の国際標準である ECMAScript の第 5 版 (現在は第 3 版が普及しています) が提案されました。新しいメソッド Object.create()。
このメソッドでは、「クラス」は関数ではなくオブジェクトです。

　var Cat = {
　　　　name: "大毛",
　　　　makeSound: function(){ alert("喵喵喵"); }
　　};

その後、newを使わずに直接Object.create()を使ってインスタンスを生成します。

var cat1 = Object.create(Cat);
　　alert(cat1.name); // 大毛
　　cat1.makeSound(); // 喵喵喵

現在、すべての主要なブラウザー (IE9 を含む) の最新バージョンがこのメソッドを導入しています。古いブラウザを使用している場合は、次のコードを使用して自分でデプロイできます。

　if (!Object.create) {
　　　　Object.create = function (o) {
　　　　　　 function F() {}
　　　　　　F.prototype = o;
　　　　　　return new F();
　　　　};
　　}

このメソッドは「コンストラクター メソッド」よりも単純ですが、プライベート プロパティやプライベート メソッドを実装できず、インスタンス オブジェクト間でデータを共有することもできず、「クラス」のシミュレーションが十分に包括的ではありません。
3. ミニマリスト アプローチ
オランダのプログラマー、Gabor de Mooij は、Object.create() よりも優れた新しいメソッドを提案しました。彼は、このメソッドを「ミニマリスト アプローチ」と呼びました。これも私がオススメする方法です。
3.1 カプセル化
このメソッドは this とプロトタイプを使用せず、コードが非常に簡単にデプロイできるため、おそらく「ミニマリストメソッド」と呼ばれます。
まず第一に、「クラス」をシミュレートするためにオブジェクトも使用します。このクラスでは、インスタンスを生成するためのコンストラクター createNew() を定義します。

　var Cat = {
　　　　createNew: function(){
　　　　　　// some code here
　　　　}
　　};

次に、createNew()でインスタンスオブジェクトを定義し、このインスタンスオブジェクトを戻り値として使用します。

　var Cat = {
　　　　createNew: function(){
　　　　　　var cat = {};
　　　　　　cat.name = "大毛";
　　　　　　cat.makeSound = function(){ alert("喵喵喵"); };
　　　　　　return cat;
　　　　}
　　};

使用する場合は、createNew()メソッドを呼び出してインスタンスオブジェクトを取得します。

　var cat1 = Cat.createNew();
　　cat1.makeSound(); // 喵喵喵

この方法の利点は、理解しやすく、明確で洗練された構造を持ち、従来の「オブジェクト指向プログラミング」構造に準拠しているため、次の機能を簡単に導入できることです。
3.2 継承
あるクラスに別のクラスを継承させるととても便利です。前者の createNew() メソッド内で後者の createNew() メソッドを呼び出すだけです。
最初にAnimalクラスを定義します。

　var Animal = {
　　　　createNew: function(){
　　　　　　var animal = {};
　　　　　　animal.sleep = function(){ alert("睡懒觉"); };
　　　　　　return animal;
　　　　}
　　};

次に、Cat の createNew() メソッドで、Animal の createNew() メソッドを呼び出します。

　　var Cat = {
　　　　createNew: function(){
　　　　　　var cat = Animal.createNew();
　　　　　　cat.name = "大毛";
　　　　　　cat.makeSound = function(){ alert("喵喵喵"); };
　　　　　　return cat;
　　　　}
　　};

このようにして取得したCatインスタンスは、CatクラスとAnimalクラスの両方を継承します。

var cat1 = Cat.createNew();
　　cat1.sleep(); // 睡懒觉

3.3 プライベートプロパティとプライベートメソッド
createNew() メソッドでは、メソッドとプロパティが cat オブジェクトで定義されていない限り、それらはプライベートです。

　　var Cat = {
　　　　createNew: function(){
　　　　　　var cat = {};
　　　　　　var sound = "喵喵喵";
　　　　　　cat.makeSound = function(){ alert(sound); };
　　　　　　return cat;
　　　　}
　　};

上記の例の内部変数soundは外部から読み取ることができません。catのpublicメソッドmakeSound()を介してのみ読み取ることができます。

　var cat1 = Cat.createNew();
　　alert(cat1.sound); // undefined

3.4 データ共有
場合によっては、すべてのインスタンス オブジェクトが同じ内部データを読み書きできるようにする必要があります。この時点では、内部データをクラス オブジェクト内および createNew() メソッドの外にカプセル化するだけです。

　　var Cat = {
　　　　sound : "喵喵喵",
　　　　createNew: function(){
　　　　　　var cat = {};
　　　　　　cat.makeSound = function(){ alert(Cat.sound); };
　　　　　　cat.changeSound = function(x){ Cat.sound = x; };
　　　　　　return cat;
　　　　}
　　};

その後、2つのインスタンスオブジェクトが生成されます:

　　var cat1 = Cat.createNew();
　　var cat2 = Cat.createNew();
　　cat1.makeSound(); // 喵喵喵

このとき、一方のインスタンスオブジェクトが共有データを変更すると、もう一方のインスタンスオブジェクトも影響を受けます。

りー

以上がJavaScript のクラスとオブジェクトの簡単な分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。