JavaScript objektorientiert

1. Die Beziehung zwischen Funktionen (Konstruktoren), Prototypen und Instanzobjekten

Die Beziehung zwischen Funktionen und Prototypen

1 Erstellen Sie ein Prototypattribut (Prototypobjekt)
für die Funktion gemäß einem bestimmten Regelsatz, wie zum Beispiel:
function fun(){
 
}
console.log(fun.prototype ); / /fun {}, was angibt, dass der Prototyp ein Objekt ist
Hinweis: Die im Prototyp definierten Attribute und Methoden werden von allen instanziierten Objekten gemeinsam genutzt, die den Konstruktor aufrufen

2 Erhalten Sie ein Konstruktorattribut (Konstruktorfunktion). Das Konstruktorattribut enthält einen Zeiger auf die Funktion (Spaß), in der sich das Prototypattribut befindet (sehr wichtig), was darauf hinweist, dass im Konstruktor auf die im Prototyp definierten Eigenschaften und Methoden zugegriffen werden kann ( Spaß),
wenn der Prototyp im Konstruktor definiert ist. Wenn eine Funktion den neuen Operator zum Instanziieren eines Objekts verwendet, wird er verwendet, um den Typ des instanziierten Objekts zu identifizieren (er hat keine große praktische Bedeutung)
Wie zum Beispiel:
function fun(name){
console.log(fun.prototype.name == this.name);//true(yjh)
this.name = "yjh1" ;
console.log(this.name);//yjh1
console.log(fun.prototype.name == this.name);//false(yjh,yjh1)
}
Spaß. Prototyp = {
Konstruktor: Spaß,
Name: "yjh"
}
var fun1 = new fun();
console.log(fun.prototype.constructor == fun ); //true
console.log(fun1.constructor == fun); //true

Die Beziehung zwischen instanziierten Objekten und Prototypen

1 Ein Operator instanziiert ein Objekt. Das Objekt enthält ein intrinsisches __proto__-Attribut, das auf den Prototyp zeigt, der nur zwischen dem Instanzobjekt und dem Prototypobjekt existiert.
Zum Beispiel:

Funktion fun(name, age){
this.name = name;
this.age = age;
this.sayName = function(){
warning(this.name);
}
}
fun .prototype = {
Konstruktor: Spaß,
Alter: 22,
sayName: function(){
alarm(this.age);
}
}
var fun1 = new fun("yjh","23");
console.log(fun1.__proto__) //fun { age="22", sayAge=function()}
console.log (fun1.__proto__ == fun.prototype); //true

C. Die Beziehung zwischen Instanzobjekten und Funktionen (Konstruktoren)

1 Wenn eine Funktion den neuen Operator verwendet, um ein Objekt zu instanziieren Das Instanzobjekt zeigt über das interne Attribut __proto__ auf den Prototyp und teilt die im Prototyp (Prototyp) definierten Attribute und Methoden.
Da das Konstruktorattribut im Prototyp (Prototyp) auf den Konstruktor verweist, verfügt das Instanzobjekt auch über die Attribute und im Konstruktor definierte Eigenschaften und Methoden von
wie:
function fun(name,age){
this.name = name;
this.age = age;
this .sayName = function(){
warning(this.name);
}
}
var fun1 = new fun("yjh","23");
fun1.sayName( ); //yjh

D. Die Beziehung zwischen Funktionen (Konstruktoren), Instanzobjekten und Prototypen

1 Das Objekt selbst wird zuerst nach der Methode durchsucht. Wenn nicht, wird weiterhin nach dem Prototyp
gesucht, z. B.:
function fun(name,age){
this.name = name;
this .age = age;
this.sayName = function(){
warning(this.name);
}
}
fun.prototype.age = "22";
fun.prototype.sayAge = function(){
Alert(this.age);
}
var fun1 = new fun("yjh","23");
fun1.age = 24 ;
fun1.sayAge(); / /24, die Methode im Prototyp wird aufgerufen;
Suchen Sie zuerst nach der sayAge-Methode, die im Instanzobjekt nicht gefunden wird, und finden Sie die sayName-Methode in Suchen Sie im Prototyp weiter nach dem Altersattribut und stellen Sie fest, dass der Alterswert im fun1-Instanzobjekt definiert wurde. Verwenden Sie ihn daher direkt und suchen Sie nicht mehr, wenn das Altersattribut nicht direkt im fun1-Instanzobjekt definiert ist. Das Ergebnis ist 23. Der Grund dafür ist, dass der Konstruktor das Altersattribut des Instanzobjekts neu definiert

____________________________________________

2. Objektorientierter Modus:
Erstes Verständnis von Funktionen:
a. Jede Funktion in JavaScript ist eine Instanz des Funktionstyps und eine Instanz des Objekttyps, die eine Funktion definiert ist ein Instanzobjekt. Das interne Attribut __proto__ des Instanzobjekts verweist auf das Prototypattribut des Objektkonstruktors, daher erbt die Instanz die Standardattribute und -methoden des Objektobjekts
b Die Funktion gibt ein Instanzobjekt zurück.

1. Um ein Objekt zu erstellen, verwenden Sie eine bestimmte Schnittstelle new Object()
Nachteile: Die Verwendung derselben Schnittstelle zum Erstellen vieler Objekte erzeugt viel wiederholten Code

2 das Factory-Muster. Verwenden Sie Funktionen zum Kapseln und Erstellen von Objekten mit bestimmten Schnittstellen
wie zum Beispiel:
function createObj(name,age){
var o = new Object();
o.name = Name ;
o .age = age;
return o;
}
var o1 = createObj("yjh",23)
Vorteile: Lösung des Problems der Verwendung einer Schnittstelle zum Erstellen mehrerer ähnlicher Objekte und das Generieren einer Menge doppelten Codes
Nachteile: Es löst nicht das Problem der Objekterkennung, das heißt, was für ein Objekttyp ist o1?

3. Konstruktormodus, JavaScript hat kein Klassenkonzept
Zum Beispiel:
function CreateObj(name, age){
this.name = name;
this.age = age;
this.sayName = function(){
alarm ("hi" + this.name);
}
}
var obj1 = new CreateObj("yjh1",23);
var obj2 = new CreateObj("yjh2",23);
Vorteile: Lösen Sie das Problem der Identifizierung des Instanzobjekttyps. Obj1- und obj2-Objekte sind vom Typ CreateObj www.2cto.com
Nachteile: Die vom Konstruktor definierten Eigenschaften und Methoden werden nicht von allen Instanzen und Methoden gemeinsam genutzt Von jeder Instanz werden zwei Instanzen verschiedener Funktionstypen aufgerufen (obj1.sayName != obj2.sayName)

4. Prototypmodus
wie:
function CreateObj(){
}
CreateObj.prototype = {
Konstruktor: CreateObj,
Name: „yjh“,
Alter: 23,
Farben: [„a“, „b“],
sayName: function(){
alert(this.name);
}
}
var obj1 = new CreateObj();
var obj2 = new CreateObj();
alert(obj1 .sayName == obj2.sayName);//true
obj1.colors .push("c");
alert(obj2.colors);//a,b,c
Erläuterung: Beim Aufruf Die Eigenschaften und Methoden der obj1- und obj2-Instanzen sowie die von der Instanz selbst definierten Eigenschaften und Methoden werden zuerst durchsucht. Wenn nicht, wird weiter gesucht, da das interne Attribut __proto__ der Instanz auf den Prototyp verweist die im Prototyp definierten Attribute und Methoden

Nachteile: Wenn die Attribute Wenn im Prototyp definierte Referenztypwerte enthalten, wirkt sich die Änderung des Attributwerts einer Instanz auf den Attributwert einer anderen Instanz aus. Dies ist richtig. Dies liegt an der gemeinsamen Natur von Prototypen.

Zum Beispiel:
function CreateObj(name,age){
console.log( this.name);//yjhyjh
this.name = name;
this .age = age;
this.colors = ["a","b"];
}
CreateObj.prototype = {
Konstruktor: CreateObj,
Name: "yjhyjh",
sayName: function(){
return this.name;
}
}
var obj1 = new CreateObj("yjh1",23);
var obj2 = new CreateObj( "yjh2",23);
alert(obj1.sayName == obj2.sayName);//true
alert (obj1.sayName());//yjh1
alert(obj2.sayName() );//yjh2
obj1.colors.push("c");
alert(obj2.colors); //a, b
Erläuterung: Definieren Sie die Attribute, die nicht geteilt werden müssen Alle Instanzen im Konstruktor und definieren die Attribute und Methoden, die im Prototyp geteilt werden müssen. Die Vor- und Nachteile des komplementären Konstruktormusters und des Prototypmusters.
Der Prototyp ist das Prototypobjekt aller instanziierten Objekte Instanz und Prototyp sind über das instanzinterne Attribut __proto__ mit dem Prototyp verbunden. Alle Instanzen teilen sich die Attribute und Methoden im Prototyp. Wenn der Konstruktor das Attribut mit demselben Namen im Prototyp, in der Methode und dann im Instanzobjekt neu definiert ruft die im Konstruktor definierten Eigenschaften und Methoden auf.

6. Vererbung (Implementierungsvererbung, Prototypkette)
besteht darin, den Prototyp eines Konstruktors als Instanziierungsobjekt eines anderen Konstruktors zu verwenden. Dieses Instanziierungsprototypobjekt erbt dann die Prototypattribute und die Methode. namens Prototypenkette
wie zum Beispiel:
function Fun1(){
this.name = ["yjh1","yjh2"];
}
Fun1.prototype = {
Konstruktor : Fun1,
sayName: function(){
alarm(this.name)
}
}
function Fun2(){}
Fun2.prototype = new Fun1();
var fun2 = new Fun2();
fun2.sayName();//yjh1,yjh2
fun2.name.push("yjh3"); //fun2.name = [ "yjh1", "yjh2", "yjh3"];
var fun3 = new Fun2();
alert(fun3.name);//yjh1,yjh2,yjh3
Nachteile: von enthaltenden Referenztypen Der Prototyp des Wert: Die im Prototyp definierten Attribute und Methoden werden von allen Instanzen gemeinsam genutzt. Das Prototypobjekt ist eine Instanz vom Typ Fun1. Daher verfügt das Prototypobjekt über ein Namensattribut, das einen Referenztypwert enthält Instanzen werden instanziiert. Wenn ein Objekt vom Typ Fun2 erstellt wird, teilen sich alle Instanzobjekte das Prototyp-Namenattribut. Durch Ändern des Namensattributwerts in der Instanz ändert
direkt den im Prototyp definierten Namensattributwert

Zum Beispiel:
function Fun1(){
this.name = ["yjh1","yjh2"];
}
Fun1. Prototyp = {
Konstruktor: Fun1,
sayName: function(){
alarm(this.name)
}
}
function Fun2(){
Fun1.call (this);
}
Fun2.prototype = new Fun1();
var fun2 = new Fun2();
fun2.sayName();//yjh1,yjh2
fun2. name.push(" yjh3"); //fun2.name = ["yjh1", "yjh2", "yjh3"];
var fun3 = new Fun2();
alert(fun2.name); //yjh1,yjh2 ,yjh3
alert(fun3.name);//yjh1,yjh2
Erklärung: Da die im Konstruktor definierten Attribute und Methoden nicht von allen Instanzen gemeinsam genutzt werden, überschreiben sie die Attribute und Methoden Im Prototyp definiert, wird es keine Probleme
durch das instanziierte Prototypobjekt (Fun2.prototype) verursachen, das Attribute mit Referenztypwerten enthält