javascript_javascript スキルにおける継承の使用法の概要

この記事の例は、JavaScript での継承の使用法をまとめたものです。皆さんの参考に共有してください。詳細は以下の通りです。

例:

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

/**
* 親クラスを継承するサブクラスを実装しますが、冗長な属性やメソッドは生成しません
* @returns {関数}
*/
定義(関数(){
return 関数(subType, superType){
var proto = 新しいオブジェクト(superType.prototype);
proto.constructor = subType;
subType.prototype = プロト;
};
});
//————————————————————————
定義(関数(){
関数 ostring
{
this.str = s;
this.length = this.str.length;
}
ostring.prototype.show = function(){
アラート(this.str);
};
ostring を返します;
});
//————————————————————————
定義(['inherit', 'ostring'], function(inherit, ostring){
関数 wstring(s){
//call を使用して親クラスのコンストラクターを呼び出します
ostring.call(this, s);
this.chlength = 2 * s.length;
}
//他の属性を継承
継承(wstring, ostring);
wstring.prototype.add = function(w)
{
alert(this.str w);
};
wstring を返します;
});

もう一度例を見てください
1. 関数を使用して実装します:

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

function Person(name) {
This.name = 名前;
}
Person.prototype.getName = function() {
this.name を返します;
}
関数 著者(名前, 本) {
This.inherit=person;
This.inherit(name);
This.books = 本;

}
var au=new 著者("どろろ","たくさん学ぶ");
au.name

または同等のもの:

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

function person(name) {
This.name = 名前;
}
Person.prototype.getName = function() {
this.name を返します;
}
関数 著者(名前, 本) {
person.call(this, name);
This.books = 本;

}
var au=new 著者("どろろ","たくさん学ぶ");
au.getName

これは単にこれをパラメータとして使用し、親クラス person のコンストラクタを呼び出し、親クラスに割り当てられているすべてのフィールドを Author サブクラスに代入しているだけなので、親クラス person コンストラクタ以外の定義済みフィールド (プロトタイプ) は存在しません。サブクラスで使用されるものは継承されます。したがって、上記の例では、getName が Person プロトタイプ オブジェクトで定義されているため、au.getName は未定義になります。

さらに、サブクラスのコンストラクターは、サブクラスの定義が親クラスによって上書きされないように、独自のドメインを定義する前に親クラスのコンストラクターを呼び出す必要があります。言い換えれば、作成者が定義した属性ブックは Person.call の後にある必要があり、そうでない場合は、Person の属性によって上書きされます。同時に、サブクラス内でサブクラスの関数ドメインを定義するためにプロトタイプを使用しないことをお勧めします。サブクラスが新しくインスタンス化された後、プロトタイプが実行され、その後、親クラスのコンストラクターが呼び出されるからです。これは、親クラスの属性が上書きされることも簡単です。

2. プロトタイプを使用して実装します:

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

function Person(name) {
This.name = 名前;
}
Person.prototype.getName = function() {
this.name を返します;
}
関数 著者(名前, 本) {
This.books = 本
}
Author.prototype=新しい人物(名前);
Author.prototype.constructor=著者;
Author.prototype.getBooks = function() {
this.books を返す;
}
var au1=new 著者("dororo1","たくさん学ぶ");
var au2=new Author("dororo2","学びを減らす");
alert(au1.getName());
alert(au2.getName());

この方法により、関数実装時にプロトタイプを継承できない問題が回避されます。 Author.prototype=new Person(name); new Person() インスタンスは Person コンストラクターとプロトタイプのすべてのプロパティを呼び出すためです。ただし、欠点は、Author.prototype がすでにインスタンス化されていることです。したがって、サブクラスがインスタンス化されると、すべての非基本データ型は参照コピーになります。したがって、上記の例では、au1 と au2 の両方のインスタンスによって返される値は dororo1. です。

3. 「混合」を使用して
を実現します。

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

function Person(name) {
This.name = 名前;
}
Person.prototype.getName = function() {
this.name を返します;
}
関数 著者(名前, 本) {
This.base = 新しい人物(名前);
for(this.base の var key){
if(!this[key]){
this[キー]=this.base[キー];
}
}
This.book=books;
}
var au1=新しい作者("どろろ1","作品");
var au2=新しい作者("どろろ2","遊び");
alert(au1.getName());
alert(au2.getName());
au1.book;
au2.book;

これは拡張機能であり、親クラスのすべてのフィールドを子クラスにコピーします。上記２点に関しては全く問題ありません。
寄生組み合わせモード)

JS の継承には属性の継承とメソッドの継承が含まれており、これらはさまざまなメソッドを通じて実装されます。
1. 属性の継承

属性の継承は、関数の実行環境を変更することで実現されます。関数の実行環境の変更は、call() メソッドと apply() メソッドを使用して実現できます。

まず、Animal の「クラス」を作成します (JS にはクラスの概念がないため、ここでは単なるシミュレーションであり、実際には単なる Function オブジェクトです)。

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

function Animal(typeName) {
// 現在のメソッドの実行環境 (this) に属性 typeName
を追加します //ただし、実行環境 (this) は、この関数が実行されたときにのみ決定できます
this.typeName = typeName;
this.colors = ["赤","その間"];
}
//関数のプロトタイプに 2 つの (オブジェクト共有) メソッドを追加したい
Animal.prototype.Shout = function () {alert("I am: --" this.typeName);};
Animal.prototype.Eat = function () {alert("I am: --" this.typeName) };
//--ライオンを定義します--「クラス」（実際には関数）
関数 Lion(tn) {
//--Animal メソッドを実行し、apply の最初のパラメータを通じて Animal の実行環境を Lion の this
に変更します。 //同様に、Lion の this は実行中にのみ決定できます
Animal.apply(this,["Lion"]);//--親クラスの変数属性を継承します。これは Lion なので新しいです。これは Lion
}
Lion.prototype = Animal.prototype; //親クラスのメソッドを継承して実行します。ただし、これは適切に記述されていません。サブクラスがメソッドを追加すると、親クラスにもこのメソッドが含まれます。
Lion.prototype.Hunt = function () {
alert("私はライオンです、狩りがしたいです~~・~");
}
var aminm = 新しい動物();
aminm.Hunt(); //---サブクラスのメソッドにアクセスできますが、これは良くありません
//----それでは、この問題をどうやって解決すればいいのでしょうか? ? ? ? ? ?
//---解決策: メソッドを継承するときは、次のように記述できます:
Lion.prototype = new Animal();//親クラスのメソッドを継承し、Animal オブジェクトをプロトタイプのプロトタイプに割り当てます。実際には、属性
も持っています。 var lion = new Lion(); // new キーワードは、作成に加えて、Lion オブジェクトの実行環境を Lion オブジェクト自体に変更します
// ---つまり、new が完了した後、Lion 関数の this は Lion 関数そのものであり、その後 Lion 関数

が呼び出されます。

新しいキーワードを分析します:

新しいキーワードは非常に優れています。上記のコードでは、新しいキーワードは次のタスクを完了しました。
1) ヒープ領域を開いて、Lion オブジェクトを保存する準備をします
2) Lion 関数の this が Lion 関数オブジェクト自体を指すように、Lion オブジェクト自体の実行環境を変更します。
3) Lion「クラス」の「コンストラクター」を呼び出して、Lion オブジェクトを作成します
4) 変数 l に Lion 関数オブジェクトのヒープアドレスを代入します。このとき、l は Lion 関数オブジェクト
を指します。 lion.Shout();
lion.Eat();
ただし、この種の継承には欠点があります。親クラスのコンストラクターが 2 回呼び出され、1 回呼び出され、その後再び new されます。

この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。