Heim > Web-Frontend > js-Tutorial > Hauptteil

Vererbung und andere Vererbung in JavaScript_Javascript-Tipps

PHP中文网
Freigeben: 2016-05-16 15:02:53
Original
1666 Leute haben es durchsucht

Einführung in die Vererbung

Vererbung in JS ist ein sehr komplexes Thema, viel komplexer als die Vererbung in jeder anderen objektorientierten Sprache. In den meisten anderen objektorientierten Sprachen erfordert das Erben von einer Klasse nur ein Schlüsselwort. Um den Zweck der Vererbung öffentlicher Mitglieder in JS zu erreichen, müssen eine Reihe von Maßnahmen ergriffen werden. JS gehört zur prototypischen Vererbung. Dank dieser Flexibilität können wir entweder die standardmäßige klassenbasierte Vererbung oder eine subtilere prototypische Vererbung verwenden. In JS sollte klar sein, dass die gesamte Vererbung über Prototypen erfolgt und JS auf der Grundlage von Objekten erbt.

Geerbt:

function Animal(name){ 
this.name = name; 
this.showName = function(){ 
alert(this.name); 
} 
} 
function Cat(name){ 
Animal.call(this, name); 
} 
var cat = new Cat("Black Cat"); 
cat.showName();
Nach dem Login kopieren

Animal.call(this) bedeutet Wenn Sie Verwenden Sie das Animal-Objekt anstelle dieses Objekts, dann verfügt Cat über alle Eigenschaften und Methoden von Animal. Das Cat-Objekt kann die Methoden und Eigenschaften von Animal direkt aufrufen

Mehrfachvererbung:

function Class10() 
{ 
this.showSub = function(a,b) 
{ 
alert(a-b); 
} 
} 
function Class11() 
{ 
this.showAdd = function(a,b) 
{ 
alert(a+b); 
} 
} 
function Class2() 
{ 
Class10.call(this); 
Class11.call(this); 
}
Nach dem Login kopieren

Es ist sehr einfach, zwei Aufrufe zu verwenden, um eine Mehrfachvererbung zu erreichen

Natürlich gibt es bei der js-Vererbung noch andere Methoden wie die Verwendung der Prototypenkette. Dies ist nicht Gegenstand dieses Artikels. Ich erläutere hier nur die Verwendung von Aufrufen. Apropos Aufruf, und natürlich bedeuten diese beiden Methoden im Grunde dasselbe. Der Unterschied besteht darin, dass der zweite Parameter von Aufruf von einem beliebigen Typ sein kann, während der zweite Parameter von Anwenden ein Array oder Argumente sein muss.

Lassen Sie mich Ihnen vorstellen, wie Sie eine einfache Vererbung in JavaScript implementieren?

Das folgende Beispiel erstellt eine Mitarbeiterklasse Employee, die alle Eigenschaften im Prototyp-Prototyp von Person erbt.

function Employee(name, sex, employeeID) {
this.name = name;
this.sex = sex;
this.employeeID = employeeID;
}
// 将Employee的原型指向Person的一个实例
// 因为Person的实例可以调用Person原型中的方法, 所以Employee的实例也可以调用Person原型中的所有属性。
Employee.prototype = new Person();
Employee.prototype.getEmployeeID = function() {
return this.employeeID;
};
var zhang = new Employee("ZhangSan", "man", "");
console.log(zhang.getName()); // "ZhangSan
Nach dem Login kopieren

Die obige Implementierung der Vererbung ist sehr grob und es gibt viele Probleme:

Beim Erstellen des Employee-Konstruktors und des Prototyps (im Folgenden als Klasse bezeichnet), wird eine Person instanziiert, was unangemessen ist.

Der Konstruktor von Employee kann den Konstruktor der übergeordneten Klasse Person nicht aufrufen, was zu einer wiederholten Zuweisung der Namens- und Geschlechtsattribute im Employee-Konstruktor führt.

Die Funktion in Employee überschreibt die gleichnamige Funktion in Person, und es gibt keinen Überlastungsmechanismus (dies ist die gleiche Art von Problem wie beim vorherigen).

Die Syntax zum Erstellen von JavaScript-Klassen ist zu fragmentiert und nicht so elegant wie die Syntax in C#/Java.

Es liegt ein Zeigefehler im Konstruktorattribut in der Implementierung vor.

Das Obige ist der Inhalt der Vererbung in JavaScript und anderer inheritance_javascript-Techniken. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!


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