相続の一部をJS

まず、継承されているかについての話を聞かせて?
簡単に言えば、それはプロパティとメソッドの一部を継承一切のオブジェクトは両方のプロパティのプロパティとメソッドは、オブジェクトのメソッドを持っていないようにすることです。
その継承が何をするか、分割されましたか?私はいくつかの一般的な、それを継承し、あなたに説明しましょう。

1.継承されたプロトタイプオブジェクト

	function Parent(){
			this.name = "zhangshan";
		}
		Parent.prototype.show = function(){
			console.log("111");
		}
		
		
		function Child(){
			
		}
		
		
//		浅拷贝
        Child.prototype = Parent.prototype;
		
		
		var t = new Parent();
		t.show();//111
		console.log(t.name);//zhangshan
		
		var f = new Child();
		f.show();//111
		console.log(f.name);//undefined

上記の我々が継承されたシャローコピーを使用しますが、子供自身がそれを表示する方法を持っている場合は、私たちならば仕方の結果ですか?それはそれをカバーする必要がありますかどうか?

		function Parent(){
			this.name = "zhangshan";
		}
		Parent.prototype.show = function(){
			console.log("111");
		}
		
		
		function Child(){
			
		}
		
		
//		浅拷贝
        Child.prototype = Parent.prototype;
//		
		Child.prototype.show = function(){
			console.log("123");
		}
		
		
		var t = new Parent();
		t.show();//123
		console.log(t.name);//zhangshan
		
		var f = new Child();
		f.show();//123
		console.log(f.name);//undefined

その結果、我々は浅いコピーを使用するので、予測が、メソッドの子のプロトタイプは、メソッドの親のプロトタイプショーを覆っ示したときに、その出力方法の値は親123となっている示して、それを解決するためにどのように?私たちは、彼の方法の深いコピーが発見されるようにすることができます。

		function Parent(){
			this.name = "zhangshan";
		}
		Parent.prototype.show = function(){
			console.log("111");
		}
		
		
		function Child(){
			
		}
		
		
//		深拷贝:不会被覆盖
		for(var i in Parent.prototype){
			Child.prototype[i] = Parent.prototype[i];
		}
//		
		Child.prototype.show = function(){
			console.log("123");
		}
		
		
		var t = new Parent();
		t.show();//111
		console.log(t.name);//zhangshan
		
		var f = new Child();
		f.show();//123
		console.log(f.name);//undefined

要約すると:操作が簡単、便利1.簡単、相続当社のプロトタイプオブジェクトを。2.しかし、プロトタイプのボディは継承メソッドとプロパティは、コンストラクタのメソッドとプロパティを継承することはできません。

継承する2.プロトタイプチェーン

function Parent(){
			this.name = "zhangshan"
		}
		Parent.prototype.show = function(){
			console.log("哈哈哈")
		}
		
		function Child(){
			
		}
		
		Child.prototype = new Parent();
		
//		Parent的实例
		var f = new Parent();
		f.show();///哈哈哈
		console.log(f.name);///zhangshan
		
//		Child的实例
		var t = new Child();
		t.show();///哈哈哈
		console.log(t.name);//zhangshan

もちろん、私たちはそこに不利益場合はプロトタイプオブジェクトのコンストラクタにプロトタイプ継承チェーン完璧なソリューションに継承させた欠陥のプロパティとメソッドが、プロトタイプチェーンを継承することはできないでしょうか?私は例を見て皆のためたいと思います:

function Parent(n){
			this.name = n;
		}
		Parent.prototype.show = function(){
			console.log("哈哈哈")
		}
		
		function Child(n){
			
		}
		
		Child.prototype = new Parent("lisi");
		
//		Parent的实例
		var f = new Parent();
		f.show();///哈哈哈
		console.log(f.name);///undefined
		
//		Child的实例
		var t = new Child();
		t.show();///哈哈哈
		console.log(t.name);//lisi

私たちは親の着信属性への道を渡すパラメータコンストラクタを使用する場合、それは価値が時間であり、我々は、name属性の親は、このも表示されていることを継承。もっとシンプルに、当社のプロトタイプチェーン、便利な定義されていない、それは現実的ではありません見つけます操作しやすいです。2.あなたが唯一のメソッドとプロパティのプロトタイプボディを継承するだけでなく、コンストラクタメソッドとプロパティを継承することができます。3.しかし、便利な質量参加。

3.コンストラクタの継承

function Parent(s){
        this.skill = s;
    }
    Parent.prototype.show = function(){
        console.log(this.skill);
    }

    function Child(n){
        // 利用this的改变
        // 在Child中执行Parent的同时,修改this指向,为Child的this
        // 因为Child将来被new执行,Child中的this,指向将来Child的实例
        Parent.call(this,n);
    }

    var p = new Parent("zhangshan");
    console.log(p.skill);//zhangshan
    p.show();//zhangshan

    var c = new Child("lisi");
    console.log(c.skill);//lisi
    c.show();//报错

上記の例とは、継承されたコンストラクタが表示される場合がありますコンストラクタできません継承プロパティまたはメソッドプロトタイプ本体の内部プロパティやメソッドを継承することができます。

4.ミックスの継承

function Parent(s){
        this.skill = s;
    }
    Parent.prototype.show = function(){
        console.log(this.skill);
    }

    function Child(n){
        Parent.call(this,n);
    }
    for(var i in Parent.prototype){
        Child.prototype[i] = Parent.prototype[i];
    }
    Child.prototype.show = function(){
        console.log("wangwu");
    }

    var p = new Parent("zhangshan");
    p.show();//zhangshan

    var c = new Child("lisi");
    c.show();//wangwu
    console.log(c.skill);//lisi

混血継承:継承コンストラクタ+プロトタイプ継承、および彼の機能は次のとおりです:1。少し複雑。2.あなたは、どちらかのコンストラクタを継承することができ、またプロトタイプを継承することができます。パラメータを渡すことは容易3.。4.コンストラクタは多重継承かもしれません。しかし、なぜ、それを継承するプロトタイプチェーンのは言及しないが、そうビーイングが適用されない時のために、継承パラメータにプロトタイプチェーンをリスクが残っているので。

5.classの継承

  class Parent{
        constructor(s){
            this.skill = s;
        }
        show(){
            console.log(this.skill);
        }
    }
    class Child extends Parent{
        constructor(n){
            super(n);
        }
    }
    var p = new Parent("zhangshan");
    p.show();//zhangshan
    
    var c = new Child("lisi");
    c.show();//lisi

私たちは、クラスES6を継承したとき、私たちは主に拡張し、スーパー依存している、これは継承する非常に便利な方法であることが判明しました。しかし、彼の作品:コンストラクタの引数を継承+プロトタイプチェーンを継承します。

公開された15元の記事 ウォン称賛10 ビュー484

おすすめ

転載: blog.csdn.net/weixin_43797492/article/details/104907819