ホームページ  >  記事  >  ウェブフロントエンド  >  jsプロトタイプ継承の2つの方法を比較紹介_基礎知識

jsプロトタイプ継承の2つの方法を比較紹介_基礎知識

WBOY
WBOYオリジナル
2016-05-16 16:54:111144ブラウズ

実際のプロジェクトでは、通常、コンストラクターを使用してオブジェクトを作成し、そのプロトタイプ オブジェクトにいくつかの共通メソッドを追加します。最後に、オブジェクトを直接インスタンス化するか、それを親クラスとして使用し、オブジェクトを宣言して親クラスを継承します。

継承するときによく使われる方法が 2 つあります。今日はそれについて少し説明します。

コードをコピーします。 コードは次のとおりです。

//親クラス
function Person(name){
this.name = name;
};

// サブクラス
function Student(sex){
person.apply(this,arguments); // 親クラスのコンストラクターを継承します
this.sex=sex;
};

1、プロトタイプを継承:

コードをコピー コードは次のとおりです:

Student .prototype = Person.prototype; //この文が実行されると、Student.prototype.constructor は Person を指します。 Person.prototype.constructor は Person を指すため、オブジェクトの割り当ては基本的に参照割り当てになります。そのため、Student.prototype.constructor も Person
Student.prototype.constructor = Student を指します。 // Student.prototype.constructor を Person
People のプロトタイプ オブジェクトを使用して Student のプロトタイプ オブジェクトを上書きします。前述したように、オブジェクトの割り当ては基本的に参照割り当てであるため、Student.prototype に対する変更が Person.prototype に反映される場合、つまりサブクラスは親に影響します。クラス。
以下をご覧ください:

コードをコピー コードは次のとおりです:
Student.prototype.add=function() {alert( "add")};
person.prototype.add();//ポップアップ追加

2. 継承されたインスタンス:


コードをコピーします。 コードは次のとおりです:
.prototype = new Person(); //ここにパラメータが渡されない場合、(); を直接記述する必要はありません new Person;
2 Student.prototype.constructor = Student;

People インスタンスを使用して Student のプロトタイプ オブジェクトを上書きします。インスタンスの作成は、前のメソッドと比べてメモリを無駄にしますが、これにより、上記のメソッドの欠点、つまり Student の変更も解決されます。この時点では、prototype は person.prototype に反映されません。つまり、サブクラスは親クラスに影響を与えません。
3. コントロール オブジェクトを使用して 1 と 2 の利点を組み合わせ、欠点を解消します

コードをコピー コードは次のとおりです。
var F = function(){};
F.prototype = person.prototype;
Student.prototype = new F();
Student.prototype.constructor = Student;

F は空のオブジェクトです。一部のプロトタイプ メソッドのみが使用され、インスタンス化中に使用するメモリが少なくなり、親クラスに対するサブクラスの影響も分離されます。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。