Heim > Web-Frontend > js-Tutorial > Was sind die Vererbungsmethoden in Javascript?

Was sind die Vererbungsmethoden in Javascript?

王林
Freigeben: 2023-01-07 11:42:55
Original
1678 Leute haben es durchsucht

Zu den Vererbungsmethoden in JavaScript gehören die Prototypenkettenvererbung, die Vererbung geliehener Konstruktoren, die kombinierte Vererbung, die Prototypenvererbung, die parasitäre Vererbung und die parasitäre kombinierte Vererbung. Unter diesen ist die kombinierte Vererbung die am häufigsten verwendete Vererbungsmethode.

Was sind die Vererbungsmethoden in Javascript?

Die Betriebsumgebung dieses Artikels: Windows 10-System, Javascript 1.8.5, Thinkpad T480-Computer.

Wenn wir in Javascript erben möchten, müssen wir zuerst eine übergeordnete Klasse bereitstellen. Wir verwenden hier Person als übergeordnete Klasse.

Alle folgenden Konstruktornamen haben keine tatsächliche Bedeutung, wie z. B. Coder, Rocker usw., sie werden nur als Beispiele verwendet gleich der Instanz der übergeordneten Klasse. Programmer.prototype=new Person();

Funktionen: Zu den Attributen, die eine Instanz erben kann, gehören: die Attribute des Konstruktors der Instanz, die Attribute des Konstruktors der übergeordneten Klasse und die Attribute des Prototyps der übergeordneten Klasse. (Die neue Instanz erbt nicht die Attribute der übergeordneten Klasseninstanz!) Nachteile: 1. Die neue Instanz kann keine Parameter an den Konstruktor der übergeordneten Klasse übergeben.

  2. Einzelvererbung.

  3. Alle neuen Instanzen teilen die Attribute der übergeordneten Klasseninstanz. (Die Attribute des Prototyps werden gemeinsam genutzt. Wenn eine Instanz die Attribute des Prototyps ändert (per1.__proto__.sex="female", dann wird per2.sex ebenfalls weiblich), und die Prototypattribute einer anderen Instanz ändern sich ebenfalls. wird geändert! )

Zweitens: Konstruktorvererbung leihen

		 function Person(name){//给构造函数添加了参数
		            this.name=name;
		            this.sex="male";
		            this.say=function(){
		                console.log(this.name);
		            }
		        }
		Person.prototype.age=21;//给构造函数添加了原型属性
Nach dem Login kopieren

Wichtige Punkte: Verwenden Sie .call() und .apply(), um den Konstruktor der übergeordneten Klasse in die Funktion der untergeordneten Klasse einzuführen (machen Sie die Funktion der übergeordneten Klasse automatisch in der untergeordneten Klasse). Funktion (Ausführung (Kopie))

Eigenschaften: 1. Erbt nur die Attribute des Konstruktors der übergeordneten Klasse und nicht die Attribute des Prototyps der übergeordneten Klasse. (Es ist aus

  cod1.age ist 18 statt 21 ersichtlich)

  2. Die Mängel 1, 2 und 3 der Prototypkettenvererbung wurden behoben.

  3. Sie können mehrere Konstruktorattribute erben (mehrere aufrufen).

  4. Parameter können in der untergeordneten Instanz an die übergeordnete Instanz übergeben werden.

Nachteile: 1. Es kann nur die Attribute des übergeordneten Klassenkonstruktors erben.

  2. Die Wiederverwendung von Konstruktoren kann nicht erreicht werden. (Sie müssen es jedes Mal erneut aufrufen, wenn Sie es verwenden.) 3. Jede neue Instanz verfügt über eine Kopie des Konstruktors der übergeordneten Klasse, der aufgebläht ist.

3. Kombinierte Vererbung (kombinierte Prototypkettenvererbung und geliehene Konstruktorvererbung) (häufig verwendet)

		function Programmer(){
            this.name="Jayee";
        }

        Programmer.prototype=new Person();//子类构造函数.prototype=父类实例

        var per1=new Programmer();
        console.log(per1);//Programmer {name: "Jayee"}
        console.log(per1.sex);//male
        console.log(per1.age);//21
        console.log(per1 instanceof Person);//true
Nach dem Login kopieren

Wichtige Punkte: Kombiniert die Vorteile der beiden Modi, Parameterübergabe und Wiederverwendung

Eigenschaften: 1. Kann den Prototyp des erben Attribute der übergeordneten Klasse können als Parameter übergeben und wiederverwendet werden.

  2. Die von jeder neuen Instanz eingeführten Konstruktorattribute sind privat.

Nachteile: Der Konstruktor der übergeordneten Klasse wird zweimal aufgerufen (Speicherverbrauch) und der Konstruktor der Unterklasse ersetzt den Konstruktor der übergeordneten Klasse im Prototyp Geben Sie dann den Aufruf dieser Funktion zurück. Diese Funktion wird zu einer Instanz oder einem Objekt, das nach Belieben Attribute hinzufügen kann. object.create() ist dieses Prinzip.

Funktionen: Ähnlich wie beim Kopieren eines Objekts und dem Umschließen mit einer Funktion.

Nachteile: 1. Alle Instanzen erben die Attribute des Prototyps.

  2. Eine Wiederverwendung ist nicht möglich. (Neue Instanzattribute werden später hinzugefügt)

5. Parasitäre Vererbung

        //借用构造函数继承
        function Coder(){
            Person.call(this,"Jayee");//重点:借用了Person
            this.age=18;
        }
        var cod1=new Coder();
        console.log(cod1);
        //Coder {name: "Jayee", sex: "male", hobby: "", age: 18, say: ƒ}
        console.log(cod1.name);//Jayee
        console.log(cod1.age);//18
        console.log(cod1 instanceof Person);//false
Nach dem Login kopieren

Wichtiger Punkt: Es geht darum, eine Hülle um die Prototypenvererbung zu legen.

Vorteile: Es wird kein benutzerdefinierter Typ erstellt, da es sich lediglich um eine Shell handelt, die das Objekt (dieses) zurückgibt, und diese Funktion natürlich zum neu erstellten Objekt wird.

Nachteile: Es wird kein Prototyp verwendet und kann nicht wiederverwendet werden.

6. Parasitäre Kombinationsvererbung (häufig verwendet)

Parasit: Geben Sie das Objekt innerhalb der Funktion zurück und rufen Sie dann auf

Zusammensetzung: 1. Der Prototyp der Funktion entspricht einer anderen Instanz. 2. Verwenden Sie apply oder call, um einen anderen Konstruktor in die Funktion einzuführen, und Sie können Parameter übergeben Video-Tutorial

Das obige ist der detaillierte Inhalt vonWas sind die Vererbungsmethoden in Javascript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage