Was sind die Vererbungsmethoden von js? Einführung in verschiedene Möglichkeiten zur Implementierung der Vererbung in js

In diesem Artikel erfahren Sie, was die Vererbungsmethoden von js sind. Eine Einführung in verschiedene Möglichkeiten zur Implementierung der Vererbung in js hat einen gewissen Referenzwert. Ich hoffe, dass sie für Sie hilfreich ist.

1. Die Art und Weise, wie js die Vererbung implementiert: Prototypenkette

Implementierungsmethode: Eine Instanz von A-Prototyp ist ein Attribut von B-Prototyp

Nein Vergessen Sie, dass das Objekt standardmäßig in der Prototypenkette vorhanden ist. Das Hinzufügen von Methoden zu Unterklassen oder das Überschreiben von Superklassenmethoden muss nach der Ersetzungsprototypanweisung platziert werden.

Nachdem die Vererbung über die Prototypenkette implementiert wurde, können keine Objektliterale verwendet werden . Erstellen Sie Methoden und Attribute, da die Prototypenkette neu geschrieben wird

Nachdem die Vererbung über die Prototypenkette implementiert wurde, werden die Referenztypattribute der Superklasse von allen Instanzen gemeinsam genutzt

function SuperType() {
  this.property = true;
  this.arr=[1,2,3]
}
SuperType.prototype.getSuperValue = function() {
  return this.property;
}
function SubType() {
  this.sub = false;
}
SubType.prototype = new SuperType();
//继承SuperType，即以superType的实例为中介，使subType。prototype指向superType的原型
SubType.prototype.getSubValue = function() { //添加新方法
  return this.sub;
}
SubType.prototype.getSuperValue = function() { // 重写超类中的方法
  return this.sub;
}
var instance1 = new SubType();
instance1.arr.push(4);
console.log(instance1.arr); //1,2,3,4
var instance2 = new SubType();
console.log(instance2.arr); //1,2,3,4

2. Vererbung in js implementieren Methode: Konstruktor ausleihen

Implementierungsmethode: Rufen Sie den Konstruktor der Oberklasse innerhalb des Konstruktors der Unterklasse auf, dh verwenden Sie call() oder apply(), damit die Umfang der Konstruktoränderungen der Oberklasse

Sie können Parameter an den Konstruktor übergeben, aber Sie können keine Funktionen wiederverwenden

function SuperType(name,age){
  this.name = name;
  this.age = age;
}
function SubType() {
  SuperType.call(this,'i','21')//继承SuperType，并传递参数
  this.job = 'actor'
}

3. Die Art und Weise, wie js die Vererbung implementiert: 🎜>

Implementierungsmethode: Verwenden Sie die Prototypenkette, um die Vererbung von Prototypeigenschaften und -methoden zu realisieren, und leihen Sie sich den Konstruktor aus, um die Vererbung von Instanzeigenschaften zu realisieren

Versteckte Gefahr: Rufen Sie den Konstruktor der übergeordneten Klasse auf zweimal (1call()-Methode, 2new SuperType() )

function SuperType(name,age){
  this.name = name;
  this.age = age;
  this.f = [1,2,3,4]
}
SuperType.prototype.sayName = function() {
  console.log(this.name)
}
function SubType(name,age) {
  SuperType.call(this,name,age)//继承SuperType，并传递参数
  this.job = 'actor'
}
SubType.prototype=new SuperType();
SubType.prototype.constructor = SubType;
SubType.prototype.sayHello=function() {
  console.log('hello')
}

var h = new SubType('hua', 18);
h.sayName()//haha
h.f.push(5)
console.log(h.f)//1,2,3,4,5
var n = new SubType();
console.log(n.f)//1,2,3,4

4. Die Art und Weise, wie js die Vererbung implementiert: prototypische Vererbung

Basierend auf einem Objekt, generieren ein neues Objekt und ändern Sie dann das neue Objekt

Superklassen-Referenztypattribute werden weiterhin gemeinsam genutzt

var person = {
  name:'lily',
  age:'21',
  friends:[1,2,3]
}
var people = Object.create(person);
people.friends.push(4);
var human = Object.create(person);
console.log(human.friends)//1,2,3,4

5. Die Art und Weise, wie js die Vererbung implementiert: parasitäre Vererbung

Erstellung Eine Funktion, die nur dazu dient, den Vererbungsprozess zu implementieren, das Objekt innerhalb der Funktion zu erweitern und dann das Objekt zurückzugeben

Zu diesem Zeitpunkt wird das Referenztypattribut der übergeordneten Klasse noch gemeinsam genutzt von allen Instanzen

function anotherFunction(original) {
  var clone  = Object(original);
  clone.sayHi = function() {
    console.log('hi')
  }
  return clone;
}
var person = {
  name:'lili',
  age:'21',
  f: [1,2,3]
}
var people1 = anotherFunction(person);
people1.f.push(4)
console.log(people1.f);// 1,2,3,4
var people2 = anotherFunction(person);
console.log(people2.f);// 1,2,3,4

6. Die Art und Weise, wie js die Vererbung implementiert: parasitäre kombinierte Vererbung

Erbt Eigenschaften durch Ausleihen von Konstruktoren und erbt Methoden durch Prototypenkettenmischung

Reduziert eine übergeordnete Klasse. Während der Ausführung des Klassenkonstruktors werden die Attribute des Referenztyps der übergeordneten Klasse nicht gemeinsam genutzt.

function SuperType(name,age){
  this.name = name;
  this.age = age;
  this.f = [1,2,3,4]
}
SuperType.prototype.sayName = function() {
  console.log(this.name)
}
function SubType(name,age) {
  SuperType.call(this,name,age)
  this.job = 'actor'
}
function inherit(superType,subType) {
  var property =  Object.create(superType.property);// 创建父类原型的一个副本，并没有调用父类构造函数
  property.constructor = subType;// 使父类原型副本的constructor属性指向子类
  subType.property = property;// 子类的原型指向父类原型副本
}
inherit(SuperType,SubType)
var instance = new SubType('haha', 18);
instance.sayName()//haha
instance.f.push(5);
console.log(instance.f);//1,2,3,4,5
var ins = new SubType();
console.log(ins.f);//1,2,3,4

Verwandte Empfehlungen:

JS-Vererbung-- Prototypkettenvererbung und Klassenvererbung_Grundkenntnisse

Detaillierte Erläuterung der Vererbungsmethoden in JS

Mehrere Möglichkeiten zur Implementierung der Vererbung in JS

Das obige ist der detaillierte Inhalt vonWas sind die Vererbungsmethoden von js? Einführung in verschiedene Möglichkeiten zur Implementierung der Vererbung in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!