Was ist ein Prototyp? Prototyp ist ein Konzept, das wir im grundlegenden Lernen von JS nicht erwähnt haben. Prototyp ist ein allgemeiner Begriff, der hauptsächlich Folgendes umfasst Prototypobjekt (Prototyp) , Objektprototyp (__proto__) , Prototypenkette Warten Sie, diese Konzepte werden laut Statistik auch häufig in Interviews gefragt. Dieser Artikel hilft Ihnen, das relevante Wissen über Prototypen zu verstehen und zu beherrschen, sodass Sie nicht länger verwirrt sind.
Wir haben viele objektorientierte Sprachen wie Java, C++ usw. studiert, aber JavaScript ist eine Ausnahme. Vor ES6 gab es kein Klassenkonzept. Es stellt sich heraus, dass wir vor ES6 Konstruktoren verwendet haben, um instanziierte Objekte zu erstellen. Der Konstruktor ist eine spezielle Funktion, die die öffentlichen Eigenschaften des Objekts enthält. Es macht nur Sinn, ihn in Verbindung mit new zu verwenden.
<script>
function Animal(name,age){ //Der erste Buchstabe des Konstruktornamens wird großgeschrieben this.name=name;
this.age=age;
this.eat=function(){
console.log('Ich esse');
}
}
var dog=new Animal('Wangcai',3) //Zur Verwendung zusammen mit new zum Erstellen eines Objekts console.log(dog.name);
console.log(dog.age);
dog.eat()
</script>
<script>zugegriffen werden
Funktion Tier(Name,Alter){
this.name=name;
this.age=age;
}
var dog=new Animal('Wangcai',3)
console.log(Hundename);
console.log(Tiername);
</script>
<script>
Funktion Tier(Name,Alter){
this.name=name;
this.age=age;
}
var dog=new Animal('Wangcai',3)
Animal.color='black'
console.log(Animal.color);
console.log(dog.color);
</script>
2.1
Nach dem Vergleich haben wir festgestellt, dass die Adressen der komplexen Datentypen der beiden unterschiedlich sind.
<Skript>
Funktion Tier(Name,Alter){
this.name=name;
this.age=age;
this.eat=function(){
console.log('Ich esse');
}
}
var dog=new Animal('Wangcai',3)
var cat=new Animal('Mimi',3)
var pig=new Animal('humhem',3)
var fish=new Animal('Gulu',3)
var Sheep=new Animal('咩咩',3)
console.log(dog.eat==cat.eat);
</script>
Wenn wir ein instanziiertes Objekt erstellen, erstellt der neue Prozess zunächst ein neues Objekt, aber komplexe Datentypen eröffnen einen Speicherplatz (Objekte, Methoden), was zu unzähligen Öffnungen für dieselbe Methode im Konstruktor führt. was zu einer extremen Speicherverschwendung führt
Der Konstruktorprototyp ist ein Attribut, das auf ein Objekt zeigt. Die in diesem Objekt gespeicherten Methoden können dann zum Erstellen von Instanzen verwendet werden können beim Konvertieren von Objekten öffentlich verwendet werden, und es besteht keine Notwendigkeit, mehrere doppelte Speicherplätze für mehrere identische komplexe Datentypen zu öffnen. Um das oben erwähnte Problem der Speicherverschwendung zu lösen, kann es auch direkt als Prototypobjekt bezeichnet werden.
Lösung: Wir verwenden das Prototypobjekt zum Speichern der öffentlichen Methode, lassen das instanziierte Objekt die Methode aufrufen und vergleichen, ob die Adressen der beiden identisch sind
<script>
Funktion Tier(Name,Alter){
this.name=name;
this.age=age;
}
Animal.prototype.eat=function(){
console.log('Ich esse');
}
var dog=new Animal('Wangcai',3)
var cat=new Animal('Mimi',3)
dog.eat()
cat.eat()
console.log(dog.eat==cat.eat);
</script> Wir haben festgestellt, dass diese Methode nicht nur erfolgreich aufgerufen wurde, sondern auch, dass die Adressen der beiden aufrufenden Methoden gleich waren. Dies bewies, dass ihr öffentlicher komplexer Datentyp nur Speicherplatz freigab und die Anzahl der eingeschriebenen öffentlichen Methoden reduzierte Der Konstruktor vor dem Problem der Ressourcenverschwendung innerhalb von Funktionen.
Die Funktion des Objektprototyps __proto__ besteht darin, Ihnen die Lösung einer Frage zu ermöglichen: Warum kann die zum Prototypattribut des Konstruktors hinzugefügte Methode beim Instanziieren des Objekts verwendet werden? Dies liegt daran, dass jedes Objekt über ein __proto__-Attribut verfügt (beachten Sie, dass davor und danach zwei Unterstriche stehen). Dieses Attribut ist auch ein Zeiger, der auf den Prototyp des Objekts des entsprechenden Konstruktors zeigt, was erklärt, warum das instanziierte Objekt Methoden aufrufen kann das Prototypobjekt.
Wir sollten beachten, dass die Funktion des Objektprototyps __protp__ nur darin besteht, eine Richtung für die Suche nach dem Inhalt im Prototypobjekt bereitzustellen. Wir müssen ihn nicht verwenden, wir müssen uns nur daran erinnern Der Prototyp des Objekts zeigt auf
, und der Prototyp-Objekt-Prototyp der Konstruktor-Funktion ein Konstruktorattribut, daher heißt es Konstruktor Es wird als Konstruktor bezeichnet, weil dieses Attribut auf den entsprechenden Konstruktor selbst verweist. Es wird hauptsächlich verwendet, um aufzuzeichnen, auf welchen Konstruktor sich das instanziierte Objekt bezieht,
<script>
Funktion Tier(Name,Alter){
this.name=name;
this.age=age;
}
Animal.prototype.eat=function(){
console.log('Ich esse');
}
var dog=new Animal('Wangcai',4)
console.log(dog.__proto__.constructor);
console.log(Animal.prototype.constructor);
</script>
Wir haben festgestellt, dass das gedruckte Ergebnis tatsächlich der Konstruktor selbst ist.