JavaScript-Simulationsmethoden zur Implementierung von inheritance_javascript-Fähigkeiten

Das Beispiel in diesem Artikel beschreibt die Methode der JavaScript-Simulation zur Implementierung der Vererbung. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Wir alle wissen, dass JavaScript nur „Klassen“ in OO simulieren und implementieren kann, was bedeutet, dass es in JavaScript keine Vererbung von Klassen gibt. Wir können die Implementierung nur simulieren, indem wir Attribute im Originalobjekt hinzufügen oder neu schreiben.

Definieren Sie zunächst eine übergeordnete Klasse,

//父类
function ParentClass() {
 this.className = "ParentClass";
 this.auth = "Auth";
 this.version = "V1.0";
 this.parentClassInfo = function () {
 return this.className + "\n" + this.auth + "\n" + this.version;
 }
}

1. Prototypische Umsetzung:

//子类
//1、prototype继承
function ChildClassByPrototype() {
 this.date = "2013-07-26";
 this.classInfo = function () {
  return this.parentClassInfo() + "\n" + this.date;
 }
}
ChildClassByPrototype.prototype = new ParentClass();
var cctest1 = new ChildClassByPrototype();
cctest1.parentClassInfo();
cctest1.classInfo();

Diese Methode ist sehr einfach. Weisen Sie einfach die Instanz der übergeordneten Klasse dem Prototypattribut der Unterklasse zu, und dann kann die Unterklasse die Methoden und Attribute des Vaters verwenden. Hier verwenden wir tatsächlich die Funktion zum Aufwärtssuchen in der Prototypenkette. In diesem Beispiel sucht JavaScript zunächst nach der Methode parentClassInfo() in der Unterklasse Daher wird weiterhin nach der Prototypeigenschaft ChildClassByPrototype gesucht, und der Wert ihrer Prototypeigenschaft ist eine Instanz von ParentClass, die über die Methode parentClassInfo() verfügt. Daher wird die Suche beendet und der Aufruf ist erfolgreich.

2. Umsetzung anwenden:

//2、apply继承
function ChildClassByApply() {
 ParentClass.apply(this, new Array());
 //ParentClass.apply(this, []);
 this.date = "2013-07-26";
 this.classInfo = function () {
  return this.parentClassInfo() + "\n" + this.date;
 }
}

Anwenden in JavaScript kann als Ersetzen von Methode B durch Methode A verstanden werden. Der erste Parameter ist das Objekt der Methode B selbst und der zweite Parameter ist ein Array. Die Werte im Array sind die Parameter, die vorhanden sein müssen Wird an Methode A übergeben. Liste: Wenn der Parameter leer ist, dh keine Parameter übergeben werden, kann er über new Array (), [] übergeben werden.

3. Rufen Sie die Prototypenimplementierung auf:

//3、call+prototype继承
function ChildClassByCall() {
 ParentClass.call(this, arguments);
 this.date = "2013-07-26";
 this.classInfo = function () {
  return this.parentClassInfo() + "\n" + this.date;
 }
}
ChildClassByCall.prototype = new ParentClass();

Call und Apply haben ähnliche Funktionen, das heißt, beide ersetzen Methode B durch Methode A, aber die übergebenen Parameter sind unterschiedlich. Der erste Parameter der Call-Methode ist das Objekt von Methode B selbst, und nachfolgende Parameter sind nicht erforderlich müssen in ein Array verpackt werden und müssen direkt nacheinander geliefert werden. Da die Funktionen fast gleich sind, warum gibt es einen zusätzlichen Satz zur Prototypenzuweisung? Dies liegt daran, dass die Aufrufmethode nur die Methodenersetzung implementiert und keine Objektattribute kopiert.

Jede Methode hat ihre anwendbare Umgebung, beispielsweise wenn die übergeordnete Klasse einen parametrisierten Konstruktor hat:

function ParentClass(className, auth, version) {
 this.className = className;
 this.auth = auth;
 this.version = version;
 this.parentClassInfo = function () {
 return this.className + "\n" + this.auth + "\n" + this.version;
 }
}

In diesem Fall ist der Prototyp nicht anwendbar und es kann „Anwenden“ oder „Aufruf“ verwendet werden

function ChildClassByApply(className, auth, version) {
 ParentClass.apply(this, [className, auth, version]);
 this.date = "2013-07-26";
 this.classInfo = function () {
  return this.parentClassInfo() + "\n" + this.date;
 }
}
function ChildClassByCall(className, auth, version) {
 ParentClass.call(this, arguments[0], arguments[1], arguments[2]);
 //ParentClass.call(this, className, auth, version);
 this.date = "2013-07-26";
 this.classInfo = function () {
  return this.parentClassInfo() + "\n" + this.date;
 }
}
ChildClassByCall.prototype = new ParentClass();

var cctest2 = new ChildClassByApply("ParentClass", "Auth", "V1.0");
var cctest3 = new ChildClassByCall("ParentClass", "Auth", "V1.0");