ホームページ > 記事 > ウェブフロントエンド > JavaScriptでクラスを定義する3つの方法とは何ですか
JavaScript でクラスを定義する 3 つの方法: 1. コンストラクターを使用してクラスを定義します。構文は "function name(){this.name=value;}" です。 2. "Object. create() メソッド クラスを定義します。 3. createNew() メソッドを使用してクラスを定義します。
このチュートリアルの動作環境: Windows 10 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。
オブジェクト指向プログラミングでは、クラスはオブジェクトのテンプレートであり、同じオブジェクトのグループ (「インスタンス」とも呼ばれます) を定義します。 ) ) 共通のプロパティとメソッド。
JavaScript 言語は「クラス」をサポートしていませんが、いくつかの回避策を使用して「クラス」をシミュレートできます。
1. コンストラクターメソッド
これは古典的なメソッドであり、教科書では必ず教えなければならないメソッドです。コンストラクターを使用して「クラス」をシミュレートし、内部で this キーワードを使用してインスタンス オブジェクトを参照します。
function Cat(){ this.name = "大毛"; }
インスタンスを生成するときは、new キーワードを使用します。
var cat1 = new Cat(); alert(cat1.name); //大毛
クラスの属性とメソッドは、コンストラクターのプロトタイプ オブジェクトで定義することもできます。
Cat.prototype.makeSound = function(){ alert("喵喵喵"); }
このメソッドの詳細については、「JavaScript オブジェクト指向プログラミング」シリーズの記事を参照してください。ここでは詳しく説明しません。その主な欠点は、教えるのが複雑で、これとプロトタイプを使用し、書くのも読むのも非常に手間がかかることです。
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 カプセル化
この方法はこのプロトタイプには適用されず、コードの展開が非常に簡単であるため、おそらく「ミニマリスト方法」と呼ばれています。
まず、「クラス」をシミュレートするためにオブジェクトも使用します。このクラスでは、インスタンスを生成するコンストラクター caeateNew() を定義します。
var Cat = { createNew: function(){ //some code here } };
次に、carateNew() でインスタンス オブジェクトを定義し、このインスタンス オブジェクトを戻り値として使用します。
var Cat = { createNew: function(){ var cat = {}; cat.name = "大毛"; car.makeSound = function(){ alert("喵喵喵"); }; } };
使用する場合は、createNew() メソッドを呼び出してインスタンス オブジェクトを取得します。
var cat1 = Cat.createNew(); cat1.makeSound(); //喵喵喵
この方法の利点は、理解しやすく、明確で洗練された構造を持ち、従来の「オブジェクト指向プログラミング」構造に準拠しているため、次の機能を簡単に導入できることです。
関連する推奨事項: JavaScript 学習チュートリアル
以上がJavaScriptでクラスを定義する3つの方法とは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。