JSのオブジェクト指向で継承される細かいこと（インスタンス）

この章では、JS オブジェクト指向における継承の小さなこと (インスタンス) を紹介し、JS における継承の特徴がどのようなものかを理解できるようにします。オブジェクト指向の継承に関するちょっとした知識。困っている友人は参考にしていただければ幸いです。

JS の継承の特徴:

1. サブクラスは親クラスを継承します。および親クラスのプロパティ

3. サブクラスへの変更は親クラスには影響しません

次は、JS 継承を示す例です

このコードは、親クラスとそのプロトタイプもサブクラスを作成し、親クラスのプライベート プロパティを継承します

<script>
        //这是父类
        function Father(name,age,marry){
            this.name=name;
            this.age=age;
            this.marry=marry;
        }
        //父类的原型
        Father.prototype.showName=function(){
            alert(this.name);
        }

        //子类
        function Son(name,age,marry,weight){
            Father.call(this,name,age,marry);
            this.weight=weight;
        }
        
 </script>

サブクラス Son が親クラスのプロトタイプを継承したい場合、私のアプローチは最初にこれを行うことです。

<script>
        //这是父类
        function Father(name,age,marry){
            this.name=name;
            this.age=age;
            this.marry=marry;
        }
        //父类的原型
        Father.prototype.showName=function(){
            alert(this.name);
        }

        //子类
        function Son(name,age,marry,weight){
            Father.call(this,name,age,marry);
            this.weight=weight;
        }
        
        //错误的做法
        Son.prototype=Father.prototype;
        Son.prototype.showAge=function(){
            alert(this.age);
        }
        var father=new Father(&#39;王大锤&#39;,30,true);
        alert(father.showAge);
        
</script>

の部分から、サブクラスのプロトタイプの変更が親クラスのプロトタイプに影響を与えることがわかります。親クラスのプロトタイプには showAge メソッドがありません。これは、前の機能から継承された 3 番目の機能です。

分析理由: 上記コードの 20 行目 Son.prototype=Father.prototype; ここの「=」は両側のオブジェクトなので、参照の場合はそのオブジェクトを意味します。左側の変更は右側のオブジェクトに確実に影響します。サブクラスのプロトタイプへの変更が親クラスのプロトタイプに影響を与えるのはこのためです。

解決策

方法 1: 中心的なアイデア。前述の問題は、「=」が問題の原因となる参照関係ではないため、ここでは「=」を保証します。は常に代入関係であり、参照ではありません。ここでは、親クラスのオブジェクトを子クラスにコピーする Clone() メソッドを定義します。

Clone() メソッドで再帰が使用される理由は、コピー プロセス中にオブジェクトがオブジェクト内でネストされる可能性があるためです。

<script>
        //这是父类
        function Father(name,age,marry){
            this.name=name;
            this.age=age;
            this.marry=marry;
        }
        //父类的原型
        Father.prototype.showName=function(){
            alert(this.name);
        }

        //子类
        function Son(name,age,marry,weight){
            Father.call(this,name,age,marry);
            this.weight=weight;
        }
        Son.prototype=new Clone(Father.prototype);
        Son.prototype.showAge=function(){
            alert(this.age);
        }
        var father=new Father(&#39;王大锤&#39;,30,true);
        alert(father.showAge);

        //通过克隆对象:核心思路是保证 &#39;=&#39; 是赋值的关系，而不是引用，也就是保证 &#39;=&#39; 的右边不是对象
        function Clone(obj){
            for(var i=0;i<obj.length;i++){
                if(typeof(obj[key]==&#39;object&#39;)){
                    this.key=new Clone(obj[key]);
                }else{
                    this.key=obj[key];
                }
            }
        }  
</script>

方法 2: コードは非常に単純ですが、考えるのが難しく、最初の方法ほど理解するのは簡単ではありません。基本的な考え方: オブジェクト自体のプロパティの変更は、そのコンストラクターのプロパティの変更には影響しません。

rreeee

以上がJSのオブジェクト指向で継承される細かいこと（インスタンス）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。