Detaillierte Erläuterung der JavaScript-Vererbungsmethode (1)

Die meisten objektorientierten Sprachen unterstützen die Vererbung. Der wichtigste Vorteil der Vererbung ist die Wiederverwendung von Code, wodurch große Softwaresysteme erstellt werden. Wenn eine Klasse die Eigenschaften und/oder Methoden einer anderen Klasse wiederverwenden kann, spricht man von Vererbung. Schauen wir uns die Vererbungsmethode von JS aus dieser Perspektive an. Die Vererbungsmethode in JS hängt eng mit der Art und Weise zusammen, Klassen zu schreiben. Unterschiedliche Arten, Klassen zu schreiben, führen zu unterschiedlichen Vererbungsmethoden. Verschiedene beliebte JS-Bibliotheken verfügen auch über unterschiedliche Vererbungsmethoden. Beginnen Sie mit der einfachsten Wiederverwendung.

1. Schreiben Sie eine Klasse im Konstruktormodus, kopieren Sie die Attribute/Felder der übergeordneten Klasse durch Methodenaufrufe, um eine Vererbung zu erreichen

Hier beide übergeordneten Klassen Klasse und Unterklasse werden im Konstruktormodus ohne Prototyp geschrieben. Die Unterklasse ruft die Funktion der übergeordneten Klasse auf, um die Attribute der übergeordneten Klasse zu kopieren.

/**
 * 父类Polygon:多边形
  * @param {Object} sides 
  */
    function Polygon(sides) {
    this.sides = sides;
    this.setSides = function(s) {this.sides=s;}
  }
    /**
  * 子类Triangle:三角形
   */function Triangle() {this.tempfun = Polygon;//父类引用赋值给子类的一个属性
   tempfunthis.tempfun(3);//调用
   delete this.tempfun;//删除该属性  
   this.getArea = function(){};}//new个对象
   var tri = new Triangle();console.log(tri.sides);//继承的属性
   console.log(tri.setSides);//继承的方法
   console.log(tri.getArea);//自有的方法
   //缺点是对于Triangle的实例对象用instanceof为父类Polygon时是false
   console.log(tri instanceof Triangle);//trueconsole.log(tri instanceof Polygon);//false
因为 JavaScript中具名函数的多种调用方式 ，子类还可以有以下的多种实现方式。只是在子类中调用父类方法不同而已。
function Triangle() {
Polygon.call(this,3); //call方式调用父类
this.getArea = function(){};
}
function Triangle() {
Polygon.apply(this,[3]); //apply方式调用父类this.getArea = function(){};
}
function Triangle() {
var temp = new Polygon(3); //new方式调用父类
for(atr in temp) { //全部复制给子类this[atr] = temp[atr];
}
this.getArea = function(){};
}

Der Nachteil dieser Methode besteht darin, dass das Instanzobjekt der Unterklasse immer falsch ist, wenn die übergeordnete Klasse mit „instanceof“ überprüft wird. Dies steht im Widerspruch zur Vererbungsbeziehung „ist ein“ in Java.

2. Schreiben Sie Klassen im Prototypmodus und erben Sie im Prototypmodus

Das eigene Objektsystem von Core JS wird mithilfe der Prototypmethode (prototypbasiert) geerbt. . Mit anderen Worten: Core JS verwendet keine gemeinsame Klassenvererbung (class Verwenden Sie stattdessen prototypische Vererbung, um Ihr eigenes Objektsystem zu implementieren. Bei der Arbeit können wir auch Prototypen verwenden, um Vererbung und Code-Wiederverwendung zu implementieren und so unsere eigenen Funktionsmodule zu erstellen.

/**
 * 父类Polygon:多边形
 * 
 */
function Polygon() {}
Polygon.prototype.sides = 0;
Polygon.prototype.setSides = function(s) {this.sides=s;}
/**
 * 子类Triangle:三角形
 */
function Triangle() {}
Triangle.prototype = new Polygon(); //这是原型继承关键的一句
Triangle.prototype.getArea = function(){}
//new个对象
var tri = new Triangle();
console.log(tri.sides);//继承的属性
console.log(tri.setSides);//继承的方法
console.log(tri.getArea);//自有方法
//instanceof测试
console.log(tri instanceof Triangle);//true，表明该对象是三角形
console.log(tri instanceof Polygon);//true，表明三角形也是多边形

Obwohl aus der Ausgabe ersichtlich ist, dass die Unterklasse die Attributseiten und die Methode setSides der übergeordneten Klasse Polygon erbt, die Seiten jedoch 0 sind, wie kann es ein Dreieck sein? Sie müssen tri.setSides(3) aufrufen, um daraus ein Dreieck zu machen. Das scheint sehr unpraktisch zu sein. Die Unfähigkeit, Parameter zu übergeben, ist das Manko der Prototypenmethode. Der Vorteil liegt darin, dass „richtig gewartet“ wird a"-Beziehung.

3. Schreiben Sie eine Klasse mit der kombinierten Konstruktor-/Prototyp-Methode und verwenden Sie die vorherige Methode, um die übergeordnete Klasse von

, die Attribute der Unterklasse werden im Konstruktor aufgehängt und die Methoden werden am Prototyp aufgehängt

.

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der JavaScript-Vererbungsmethode (1). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!