Heim >Web-Frontend >js-Tutorial >So implementieren Sie eine parasitäre zusammensetzbare Vererbung mithilfe von JavaScript

So implementieren Sie eine parasitäre zusammensetzbare Vererbung mithilfe von JavaScript

亚连
亚连Original
2018-06-13 14:40:591532Durchsuche

In diesem Artikel wird hauptsächlich die parasitäre kombinierte Vererbung von JavaScript vorgestellt und die Prinzipien, Implementierungsmethoden und zugehörigen Vorsichtsmaßnahmen in Form von Beispielen im Detail analysiert. Freunde in Not können sich darauf beziehen.

Die Beispiele in In diesem Artikel wird die parasitäre zusammensetzbare Vererbung von JavaScript beschrieben. Ich teile es Ihnen als Referenz mit:

Tatsächlich enthält das Buch „JavaScript Advanced Programming“ bereits den vollständigen Code Bei der Vererbung geht es darum.

Zuallererst gibt es in js zwei Möglichkeiten, Attribute für Objekte zu definieren:

//通过执行构造函数设置属性
function A(){
  this.a = 1;
}
//通过原型设置属性
A.prototype.b = 1;

Also:

Wenn eine Klasse Sub eine andere Klasse Super erben möchte, dann Sie müssen die Attribute der übergeordneten Klasse unter dem Prototyp erben. Außerdem müssen Sie den Konstruktor der übergeordneten Klasse ausführen.

Das heißt, Damit eine Klasse Sub eine andere Klasse Super erben kann, muss sie nicht nur die Prototypeigenschaften und -methoden über die Prototypenkette erben, sondern die Vererbung auch durch Aufrufen des Konstruktors der übergeordneten Klasse innerhalb der Klasse realisieren Unterklassenkonstruktor. Vererbung von Instanzeigenschaften.

1. Vererben Sie die Attribute unter dem Prototyp

Wie Sie oben sehen können, werden die Attribute unter dem Prototyp der Super-Klasse nicht vererbt, daher muss dies in diesem Teil geschehen unten vererbt werden.

Direct "=" wird definitiv nicht funktionieren, da es nach dem Ändern der Eigenschaften in Sub.prototype keine Auswirkungen auf die Objekte in Super.prototype haben kann, d. h. nicht Sub.prototype=Super.prototype.

Schreiben Sie zunächst eine Methode, um eine Kopie des Objekts zu erstellen

function object(o){
  function A(){}
  A.prototype = o
  var ox = new A()
  return ox
}

Das durch die obige Funktion erhaltene Objekt ox verfügt über alle Attribute des Objekts o (in der Prototypenkette) und modifiziert die Attribute von ox hat keine Auswirkungen auf o, was dem Erstellen einer Kopie von o entspricht.

Prototypische Vererbung ist die oben genannte „Objekt“-Funktion, die in vielen Quellcodes der Klassenbibliothek zu finden ist.

Einfach ausgedrückt bedeutet prototypische Vererbung, dass die übergeordnete Klasse nicht direkt instanziiert werden muss Durch das Instanziieren einer temporären Kopie wird dieselbe Prototypkettenvererbung implementiert. (Das heißt, der Prototyp der Unterklasse verweist auf die Instanz der Kopie der übergeordneten Klasse, um die gemeinsame Nutzung von Prototypen zu erreichen.)

Tipps:Wie wir alle wissen, wird die Vererbung der Prototypenkette durch erreicht Verweisen des Prototyps der Unterklasse auf die Instanz der übergeordneten Klasse und Prototypvererbung bedeutet, dass der Prototyp der Unterklasse auf eine Instanz der Kopie der übergeordneten Klasse verweist, um eine Prototypenfreigabe zu erreichen .

ECMAScirpt 5 standardisiert die prototypische Vererbung durch die neue Object.create()-Methode.

Mit der Objektmethode können Sie die Eigenschaften von Super.prototype nach Sub.prototype „kopieren“. Natürlich müssen Sie hier auch die Ausrichtung des Konstruktors korrigieren.

function inherit(subType,superType){
 var prototype=Object.create(superType.prototype);
 prototype.constructor=subType;
 subType.prototype=prototype;
}

2. Führen Sie die Konstruktoren der übergeordneten Klasse bzw. der Unterklasse aus und erben Sie die Attribute unter diesem Teil:

//父类
function Super(){
this.sss=1
}
//子类
function Sub(){
//arguments是Sub收到的参数,将这个参数传给Super
Super.apply(this, arguments)
}
//实例
sub = new Sub()

Super.apply(this, arguments)Verwenden Sie in diesem Satz die Super-Klasse als Eine normale Funktion wird ausgeführt, aber diese der Super-Klasse wird durch die der Sub-Klasse ersetzt, und die von Sub empfangenen Parameter werden auch an Super übergeben

Das endgültige Ausführungsergebnis entspricht sub .sss=1

Im Anhang sind die Merkmale, Vor- und Nachteile verschiedener Vererbungsmethoden aufgeführt

Es gab eine Zeit, in der JavaScript die Vererbung von Klassenimplementierungen nicht standardisierte, was dazu führte Verschiedene Codes zum Implementieren der Vererbung. Unabhängig davon, wie sich der Code ändert, basiert die Vererbung auf zwei Methoden:

1 Durch die Prototypenkette , dh den Prototyp der Unterklasse zeigt auf die Instanz der übergeordneten Klasse, um die gemeinsame Nutzung von Prototypen zu erreichen.
2. Leihen Sie sich den Konstruktor aus, d. h. über js's apply und call kann die Unterklasse die Attribute und Methoden der übergeordneten Klasse aufrufen kann alle gemeinsam genutzten Attributmethoden implementieren, aber Attribute und Methoden können nicht exklusiv sein

(z. B. ändert Sub1 die Funktion der übergeordneten Klasse und alle anderen Unterklassen Sub2, Sub3 ... können die alte Funktion nicht aufrufen

). Und geliehener Konstruktor

kann nicht nur exklusive Eigenschaften und Methoden haben, sondern auch Parameter im Unterklassenkonstruktor übergeben, der Code kann jedoch nicht wiederverwendet werden. Im Allgemeinen kann

die ausschließliche Nutzung aller Attributmethoden erreichen, aber keine Attribute und Methoden gemeinsam nutzen (z. B. wenn Sub1 eine neue Funktion hinzufügt und diese dann in Sub2, Sub3 ... verwenden möchte). realisiert werden, können jeweils nur Sub2, Sub3... im Konstruktor hinzugefügt werden). Kombinierte Vererbung besteht darin, die beiden oben genannten Vererbungsmethoden zusammen zu verwenden. Gemeinsame Eigenschaften und Methoden werden mithilfe der Prototypenkettenvererbung implementiert, und exklusive Eigenschaften und Methoden werden mithilfe geliehener Konstruktoren implementiert js. Vererbung; warum heißt es „fast“? Weil Geeks, die es ernst meinen, entdeckt haben, dass es einen kleinen Fehler in der kombinatorischen Vererbung gibt. Bei der Implementierung wurde die Superklasse (Elternklasse) zweimal aufgerufen. Ist es möglich, dass die Leistung nicht dem Standard entspricht? Wie kann man es lösen? So entstand „parasitäre Vererbung“.

Parasitäre Vererbung (prototypische Vererbung) bedeutet, dass keine Instanziierung der übergeordneten Klasse erforderlich ist. Durch die direkte Instanziierung einer temporären Kopie wird dieselbe Prototypkettenvererbung implementiert. (Das heißt, der Prototyp der Unterklasse verweist auf die Instanz der Kopie der übergeordneten Klasse, um eine gemeinsame Nutzung des Prototyps zu erreichen.)

„Parasitische Kombinationsvererbung“ verwendet „parasitäre Vererbung“, um den kleinen Fehler zu beheben „Kombinationsvererbung“, wodurch die perfekte Implementierung von js vererbt wird.

Beispielcode:

function SuperType(name,colors){
  this.name=name;
  this.colors=colors;
}
SuperType.prototype.getSuperProperty=function(){ return this.name; }
function SubType(job,name,colors){
  SuperType.call(this,name,colors);
  this.job=job;
}
SubType.prototype.getSubPrototype=function(){ return this.job; }
function inherit(subType,superType){
  var prototype=Object.create(superType.prototype);
  prototype.constructor=subType;
  subType.prototype=prototype;
}
inherit(SubType,SuperType);
var instance=new SubType("doctor","John",["red","green"]);
console.log(instance.getSubPrototype());  //输出"doctor"
console.log(instance.getSuperProperty());  //输出"John",成功调用在父类原型定义的方法

Der Attribut-Vererbungscode lautet

Der Prototyp-Vererbungscode lautetSuperType.call(this,name,colors);

Das Obige habe ich zusammengestellt Ich hoffe, dass es in Zukunft für alle hilfreich sein wird. inherit(SubType,SuperType);

Verwandte Artikel:

So implementieren Sie die Kollisionserkennung in JS

Wie verwende ich sie mit Gulp und Bower in Angular1?

Welche Methoden gibt es zum Debuggen von JS-Skripten?

So implementieren Sie ein Suchfeld mit Angular

Detaillierte Einführung in die Interpolation in Vue

Das obige ist der detaillierte Inhalt vonSo implementieren Sie eine parasitäre zusammensetzbare Vererbung mithilfe von JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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