いくつかの方法でJSの継承

継承

JSは、コンセプトを継承しました。

  • [特定の方法]でオブジェクトのプロパティと別のオブジェクトのメソッドにアクセスすることができるように、我々はこのアプローチの継承を呼び出します 并不是所谓的xxx extends yyy

なぜ私は、継承を使用する必要がありますか?

  • 一部のオブジェクトは、メソッド(アクション、行動を)持っているが、これらの方法や関数がコンストラクタで宣言されている場合は、これらの方法は、機能しているメモリの浪費につながることができます
    function Person(){
        this.say=function(){
            console.log("你好")
        }
    }
    var p1=new Person();
    var p2=new Person();
    console.log(p1.say === p2.say);   //false

継承最初の方法:継承するプロトタイプチェーン1

    Person.prototype.say=function(){
        console.log("你好")
    }
  • 短所:重要ではありません1,2のメソッドを追加しますが、多くの方法が、過剰な冗長コードにつながる場合

第二の方法の継承:継承するプロトタイプチェーン2

    Person.prototype = {
        //切记不能忘记
        constructor:Person,
        say:function(){
            console.log("你好");
        },
        run:function(){
            console.log("正在进行百米冲刺");
        }
    }
  • 注意点:
  • 、通常の状況下では、我々は、プロトタイプオブジェクトを変更し、オブジェクトを作成する必要があります
  • オブジェクトプロトタイプの元の構造を破壊しないようにBの下で、一般的に、新しいプロトタイプは、コンストラクタのプロパティを追加しています

継承された第三の方法:継承コピー(混合継承:ミックスイン)

  • シーン:時には、プロパティでオブジェクトを使用したいが、あなたは、オブジェクトのコピーを作成することができますので、それを直接変更することはできません
  • 実用的なアプリケーション:
    • jqueryの:$延長:.書き込みjqueryのプラグインへの唯一の道を
      • テーブルコントロールに基づいてjQueryのパッケージ
    var o1={ age:2 };

    var o2 = o1;
    o2.age=18;      
    //1、修改了o2对象的age属性
    //2、由于o2对象跟o1对象是同一个对象
    //3、所以此时o1对象的age属性也被修改了
    var o3={gender:"男",grade:"初三",group:"第五组",name:"张三"};
    var o4={gender:"男",grade:"初三",group:"第五组",name:"李四"};
    //上述代码中,如果使用拷贝继承对代码进行优化会非常和谐

    //实现拷贝继承:
    //1、已经拥有了o3对象
    //2、创建一个o3对象的拷贝(克隆):for...in循环
    

    //3、修改克隆对象,把该对象的name属性改为"李四"
    
  • 1を達成:
    var source={name:"李白",age:15}
    var target={};
    target.name=source.name
    target.age=source.age;
  • 浅い対深いコピー
    • シャローコピーちょうど1つのコピー属性、無内部オブジェクト
    • 実際には、深いコピーは、オブジェクトのプロパティのいくつかの層から再帰的なコピーの原理を使用することです
        var students=[
            {name:"",age:""},
            {name:"",age:""}
        ]
  • もちろん、上記のように再利用することはできません、実際のコードの書き込み処理は、非常に多くの場合、コピー継承の道を使用するので、再利用するために、あなたはそれらをカプセル化する関数を書くことができます。
    function extend(target,source){
        for(key in source){
            target[key]=source[key];
        }
        return target;
    }
    extend(target,source)
  • コピーは、実際の開発に非常に多くの利用シナリオを継承し、そのライブラリの多くは、これを達成しているので、
    • jqueryの:$延びています。
  • ES6 <オブジェクトの拡張演算子>と特異的に健康の連続した場合にコピーするように設計されています。
    • 長所:簡単なとんでもありません
      var source={name:"李白",age:15}
      //让target是一个新对象,同时拥有了name、age属性
      var target={ ...source }
    
      var target2={ ...source,age:18 }

相続の第四モード:原型継承:(ダグラス彼の本の蝶で来ます)

  • シーン:
    • 、純粋なオブジェクトの作成:オブジェクトプロパティではない何を
    • B、親オブジェクトから子オブジェクトの継承を作成します
      js var parent={ age:18,gender:"男"}; var student=Object.create(parent); //student.__proto__===parent
  • 使用します。
    • 空のオブジェクト:Object.create(ヌル)
        var o1={ say:function(){} }
        var o2=Object.create(o1);

第五道の継承:ボローコンストラクタの継承

  • シナリオ:論理は似たような状況の2種類の間のコンストラクタに適用されます
  • 原理:コール機能、呼び出しを適用します
function Animal(name,age,gender){
    this.name=name;
    this.age=age;
    this.gender=gender;
}
function Person(name,age,gender,say){
    this.name=name;
    this.age=age;
    this.gender=gender;

    this.say=function(){

    }
}
  • 制限事項:動物(親クラスのコンストラクタ)コードが人に完全に適用する必要があります(サブクラスのコンストラクタ)

  • 借り実装上のコードコンストラクタ
function Animal(name,age){
    this.name=name;
    this.age=age;
}
function Person(name,age,address){
    Animal.call(this,name);
    //this.name=name;
    //this.age=age;
    this.address=address;
}
  • 寄生、寄生組み合わせの継承継承

おすすめ

転載: www.cnblogs.com/sunhang32/p/11838821.html