継承のJSを理解しやすいの7つの方法

JS継承されたメソッド7に導入するために、

  一部の人々は、あなたは、単にどのタイプ(クラスが継承するリファレンスを定義することができ、古典的なオブジェクト指向言語では、あなたはクラスオブジェクトを定義するために傾斜させてもよい、JavaScriptが真にオブジェクト指向言語ではないと思われるC ++の継承のいくつかの簡単な例のを) 、JavaScriptはないコピー継承オブジェクト関数を介して、実装の別のセットを使用したが、プロトタイプチェーンを介して継承します

まず、プロトタイプチェーンを継承します

// プロトタイプ継承チェーン
機能人(名前、年齢){
     この .nameの= 名;
     この .age = 年齢; 
} 
Person.prototype.show = 関数(){ 
    にconsole.log({ `Iドルこの } .nameのを、私は{$ この.age `})
} 
関数ワーカー(名前、年齢、職業){ 
    Person.call(この、名前、年齢);
     この .JOB = ;職業
} 
// Woker場合は、ここでプロトタイプオブジェクト方法は、プロトタイプのリダイレクトので、次のコードでは、第二の方法について説明します 
Worker.prototype = 新しい新しい人を();
 // ここに書く必要があります 
Worker.prototype.showJob =機能(){ 
        にconsole.logは( `私の仕事は、{$でこの.job`})
;} 
VARの鉱山= 新しい新しい労働者を( '良い'、18 '書き込みコード' ); 
はconsole.log(鉱山); 
鉱山。ショー(); 
mine.showJob();
問題:
1.サブクラスは、親クラスのプロトタイプのメソッドをオーバーライドすることができ、Woker.prototype .__プロト__ショー=ヌル、Personオブジェクトの変更のプロトタイプ方法でこの時間;
2.親クラスのパブリック属性とプライベート属性のサブクラスは、公有財産となっています。
3.元のプロトタイプオブジェクトの属性およびメソッドサブクラスが存在する場合、Woker.prototype =新しい人()の後に、方法は得られなくなる前に。
 
プロトタイプのリダイレクトは説明する:Woker.prototype =新しい人を();
1.自分のヒープメモリが(手動constructorプロパティヒープメモリに増加する決意を)欠落しているプロトタイプクラスのコンストラクタで、その結果、constructorプロパティではありません開きます
プロトタイプのリダイレクトは、デフォルトのブラウザは、ヒープメモリのプロトタイプを開きます2.ので、あなたには、いくつかのメソッドやプロパティを保存した場合、これらのものは、(失われ、解放されます:ビルトインクラスが許可されていないプロトタイプが自分にリダイレクトするように開きますヒープメモリ、内部クラスのプロトタイプ上に構築された多くのプロパティは、なくなってアドレス変更するので、これが許可されていません)
 

第二に、借り入れコンストラクタの継承

関数人(名前、年齢){
       この .nameの= 名前;
      この .age = 年齢; 
} 
関数ワーカー(名前、年齢、ジョブ){ 
      Person.call(この、名前、年齢)。
      この .JOB = 仕事。
} 
VARの鉱山= 新しいワーカー( '佳'、18 '写代码的')。
console.log(鉱山)。

利点:1プロトタイプチェーンに関しては、コンストラクタは、コンストラクタのスーパータイプサブタイプのコンストラクタに引数を渡すことができ、大きな利点を持ってい借ります。

短所:1、唯一の親クラスのコンストラクタのプロパティを継承することができます。

   図2は、多重化コンストラクタを達成することはできません。(毎回のリコールを持つ各)

   3、親クラスのそれぞれの新しいインスタンスは、肥大化したコピーコンストラクタを持っています。

 

第三に、継承の組み合わせ(継承鎖とプロトタイプ組成ボローコンストラクタは継承)(共通)

// 组合继承
機能の人(名前、年齢){
     この .nameの= 名前;
    この .age = 年齢; 
} 
Person.prototype.show = 関数(){ 
        にconsole.log( `我の是の$ { この .nameの}、我今年$ { この.age}`)
} 
関数ワーカー(名前、年齢、ジョブ){ 
    Person.call(この、名前、年齢);
    この .JOB = 仕事。
} 
Worker.prototype = 新しい人(); 
Worker.prototype.constructor = 労働者。
Worker.prototype.showJob =機能(){ 
    はconsole.log( `私の仕事はthis.jobある} {` $)
}; 
のvar =マイン新しい新しいワーカー( '良い'、18 '奇妙な仕事' ;)
はconsole.log(鉱山); 
鉱山。ショー(); 
mine.showJob();

フォーカス:質量参加と再利用、2つのモードの長所を兼ね備え

利点:1、パラメータは、再利用可能な転送することができ、親クラスのプロトタイプのプロパティを継承することができます。

   2は、それぞれの新しいインスタンスコンストラクタの属性はプライベート導入されます。

短所:二回親クラスのコンストラクタ(メモリ消費)と呼ばれる、サブクラスのコンストラクタは、プロトタイプで親クラスのコンストラクタを置き換えます。

 

第四に、原型継承

// 式継承のプロトタイプ
関数Woker(O){
     関数空(){}; 
    Empty.prototype = O;
     戻り 新しい新しい(空の); 
} 
VARの鉱山= { 
    名: '甲' 
    年齢: 18は
    ジョブ:「便利屋' 
}; 
VAR anotherMine = Woker(鉱山)。

フォーカス:オブジェクトの機能をパッケージングした後、呼び出し元の関数に戻り、この機能は、プロパティまたはオブジェクトのインスタンスを追加して自由になりました。object.create()が原則です。

特徴:オブジェクトをコピーと同様に、ラップする関数を使用します。

短所:1、すべてのインスタンスは、プロトタイプのプロパティを継承します。

   2、多重化を達成することはできません。(新たな特性の例は、後で追加されます)

VaRの woker = { 
    名: '甲' 
    年齢: 18である
    仕事: '便利屋' 
} 
VARの鉱山= Object.create(woker)。

原則として、上記と同様、Object.create新しい()メソッドでのECMAScript 5は、正規化されたプロトタイプを継承しました。

 Object.create:内蔵Objectクラスのメソッドは、自然に来ます
1.空のオブジェクトを作成します。
 2.空(空のオブジェクトのプロトタイプとして渡された新しく作成されたオブジェクトへの)最初に渡された__proto__の対象に新しく作成されたオブジェクトをしてみましょう
 
V.寄生継承
// 寄生継承
関数createAnother(O){
     VARの人= Woker(O); 
    person.show = 関数(){ 
        にconsole.log( `Iはjia`)
        } 
    戻り人; 
} 
VARの鉱山= { 
    名:「甲' 
    年齢: 18であり
    仕事: '便利屋' 
}; VAR anotherMine = createAnother(鉱山)。   

フォーカス:プロトタイプ式を設定することであるシェルを継承しています。

長所:それはオブジェクトを返すように設定するだけのシェル(本)、この関数は、作成した当然のこととなっている新しいオブジェクトであるため、カスタムタイプを作成していません。

短所:プロトタイプに役に立たないが、再利用することはできません。

またObject.create()メソッドを実装してもよいです

 

第六に、寄生複合継承

  // 寄生组合式继承
関数inheritProto(親、子){
       VARの O = Object.create(parents.prototype)。
       o.constructor = 子。
       child.prototype = O。
} 
// 父类构造函数
関数親(姓){
        この .surname = 姓。
} 
Parents.prototype.getSurname = 関数(){ 
       にconsole.log(この.surname)。
} 
// 子类构造函数
関数子供(姓、年齢){ 
        Parents.call(この、姓)。
        この .age = 年齢; 
} 
inheritProto(親、子)。

Child.prototype.getAge = 関数(){ 
         にconsole.log(この.age)。
}

継承の利点、最も効果的な方法と組み合わせて寄生継承設定寄生継承及び組成物は、型の継承に基づいて達成します。YUIさんYAHOO.lang.extend()メソッドは、寄生継承の組み合わせを使用しているので非常に広く使用されているJavaScriptライブラリで初めてこのモデル。YUIの詳細については、httpを訪問://開発者yahoo.com/yui/ ..

 

七、ES6クラスの継承

クラスPerson { 
    コンストラクタ(名前、年齢){ 
        この .nameの= 名前;
        この .age = 年齢; 
    } 
    ショー(){ 
        アラート(この.nameの)。
        警告(この.age)。
    } 
} 

クラス作業者が延び人{ 
    コンストラクタ(名前、年齢、ジョブ){ 
        スーパー(名前、年齢)。
        この .JOB = 仕事。
    } 
    showJob(){ 
        アラート(この.JOB)。
    } 
} 
私は聞かせて = 新しい( '攻城狮前端' '甲'、18、労働者)。
me.show();
me.showJob();

 さて、7つの共通JSが継承されたメソッドはオーバー導入します。~~

 

 

おすすめ

転載: www.cnblogs.com/jiajialove/p/11264072.html
おすすめ