ホームページ >ウェブフロントエンド >jsチュートリアル >jsでクラスを定義する方法は何ですか
今回は、jsでクラスを定義する方法と、jsでクラスを定義する際の注意点についてお届けします。実際のケースを見てみましょう。
ECMAScript6 はすでにクラスをサポートしていますが、以前のバージョンはクラスをサポートしていませんでしたが、いくつかのメソッドを通じてクラスをシミュレートできます。
js のクラスは重要であると同時に、曖昧に感じられることがよくあります。
まず、js の 3 つの重要な知識ポイント、this、プロトタイプ、コンストラクターを強調しましょう。
クラスを定義 (シミュレーション) するいくつかの方法をまとめてみましょう:
function createObject(name,age){ var obj = new Object(); obj.name = name; obj.age = age; obj.getName = function(){ return this.name; }; obj.getAge = function(){ return this.age; } return obj; } var obj2 = createObject("王五",19); console.log(obj2.getName()); console.log(obj2.getAge()); console.log(obj2.constructor);
ファクトリ パターンのメソッドオブジェクトの作成、ファクトリ パターンは受け入れられたパラメータに基づいて作成できます 必要な情報を含むオブジェクトこのメソッドは無制限に呼び出すことができ、毎回 2 つのプロパティと 2 つのメソッドを含むオブジェクトを返します。ファクトリ パターンは、類似したオブジェクトを作成する問題は解決しますが、オブジェクトの識別の問題は解決しません。つまり、オブジェクトのカテゴリを決定してオブジェクトとして統一することはできません。
2.ConstructorMethod
function Person(name,age,job){ this.name = name; this.age = age; this.job = job; } Person.prototype = { constructor:Person, getName:function(){ return this.name; }, getAge:function(){ return this.age; }, getJob:function(){ return this.job; } } var p = new Person("二麻子",18,"worker"); console.log(p.constructor); console.log(p.getName()); console.log(p.getAge()); console.log(p.getJob());
コンストラクター メソッドはオブジェクトの所有権を決定し、オブジェクトの型を決定できますが、コンストラクター内のメソッドは各オブジェクトで再作成する必要があるため、パフォーマンスの問題が発生します。
function Person(){ } Person.prototype = { constructor:Person, name:"张三", age:21, job:"teacher", getName:function(){ return this.name; }, getJob:function(){ return this.job; } } var p = new Person(); console.log(p.getName()); //张三 console.log(p.getJob()); //teacher var p2 = new Person(); p2.name = "李四"; console.log(p2.getName()); //李四
サンプルコードから、オブジェクトインスタンスがプロトタイプ内の値にアクセスできるが、オブジェクトインスタンスが同じである場合、プロトタイプ内の値を上書きできないことがわかります。 name をプロトタイプ定義属性として使用すると、この属性はプロトタイプ内のその属性をマスクしますが、オーバーライドしません。
4. カプセル化 (ここではそう呼ぶことにします)
var Dog = { createDog:function(){ var dog = {}; dog.name = "汪汪"; dog.sayHello = function(){ console.log("Hello World!"); }; return dog; } }; var dog = Dog.createDog(); dog.sayHello();
はコードをカプセル化し、全体としてインスタンス オブジェクトを返します。これはファクトリ パターンに似ています。
この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。
推奨読書:
以上がjsでクラスを定義する方法は何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。