Heim > Web-Frontend > js-Tutorial > Hauptteil

Die Beziehung zwischen JS-Konstruktor, Instanzobjekt und Prototypobjekt

灭绝师太
Freigeben: 2021-10-29 17:15:36
Original
2523 Leute haben es durchsucht

Objektorientiertes Denken ist ein abstrakter Prozess ----> Der Prozess der Instanziierung kann durch JS-Konstruktoren erstellt werden. Lassen Sie uns Codebeispiele verwenden, um zu diskutieren~

    //自定义构造函数   
     function Person(name,age,gender) 
     {          
         this.name = name;          
         this.age = age;          
         this.gender = gender;          
         this.eat = function () 
         {            
             console.log("吃大蒜拌臭豆腐加榴莲酱");          
         };     
     }
Nach dem Login kopieren

Konstruktor ----> Create object per

var per = new Person('Linda', 23, 'female'); Ergänzung: console.dir(per) kann die Struktur (Attribute und Attributwerte) des Objekts pro wie folgt ausdrucken:

实 1. Das Instanzobjekt wird durch den vom Konstruktor erstellten Prozess instanziiert. 2. So beurteilen Sie Ist das Objekt das Ergebnis der Instanz eines Konstruktors? (

Empfehlen Sie die zweite Sekunde, um die zweite zu empfehlen. Art von

1) Über den Konstruktor, das heißt, Instanzobjekt.Constructor == Konstruktor Funktionsname: console.log (dog.constructor == Animal);

Die Beziehung zwischen JS-Konstruktor, Instanzobjekt und Prototypobjekt

Der Konstruktor, der Objekte erstellt, wird Probleme verursachen, sehen wir uns das folgende Beispiel an

       function Person(name, age) {
          this.name = name;
          this.age = age;
          this.eat = function () {
            console.log("今天吃红烧土豆");
          }
        }
        var per1 = new Person("小白", 20);
        var per2 = new Person("小黑", 30);
            per1.eat();
            per2.eat();
Nach dem Login kopieren

Wenn das Ergebnis als falsch ausgegeben wird, kann daraus geschlossen werden, dass per1 und per2 dies nicht tun Teilen Sie die Wenn Sie die Methode eat verwenden, lässt sich leicht ableiten, dass die über den benutzerdefinierten Konstruktor erstellte Objektinstanz keinen Speicherplatz spart, was zu einem Prototyp zur Lösung dieses Problems führt.

            function Person(name,age) {
                  this.name=name;
                  this.age=age;
             }
             
             //通过原型来添加方法,解决数据共享,节省内存空间
             Person.prototype.eat=function () {
                 console.log("吃凉菜");
             };
                
             var p1=new Person("小明",20);
             var p2=new Person("小红",30);
Nach dem Login kopieren
Beim Drucken der Ergebnisse haben wir festgestellt, dass die beiden Instanzobjekte p1 und p2 die gemeinsame Nutzung von Daten ermöglichen. Wenn wir uns jedoch die Struktur des Instanzobjekts ansehen, finden wir die Eat-Methode nicht, aber das Objekt kann tatsächlich die Eat-Methode aufrufen.来 再 Dann überprüfen wir die Struktur der Person des Konstrukteurs




Beim Betrachten der Struktur des Objekts über console.dir (P1) haben wir festgestellt, dass zusätzlich zum Alter auch die Struktur des Objekts angezeigt wird und Namensattribute gibt es auch ein _proto_-Attribut, dessen Wert ein Objekt ist, das in JavaScript als impliziter Prototyp bezeichnet wird. Der implizite Prototyp eines Objekts verweist auf den Prototyp-Prototyp des Konstruktors, der das Objekt erstellt. Dadurch wird auch sichergestellt, dass die Instanz auf die im Konstruktor-Prototyp definierten Eigenschaften und Methoden zugreifen kann. Die Beziehung zwischen JS-Konstruktor, Instanzobjekt und Prototypobjekt



Zusammenfassung der Beziehung zwischen JS-Konstruktor – Instanzobjekt – Prototyp. Objekt                                     

1 造 Konstruktfunktion kann das Objekt instanziieren 2. Der Konstruktor hat eine Eigenschaft namens Prototype, die das Prototypobjekt des Konstruktors ist;

Das Prototypobjekt des Instanzobjekts (__proto__) verweist auf das Prototypobjekt des Konstruktors.

5. Die Rolle des Prototyps besteht darin, Daten zu teilen und Speicherplatz zu sparen.

Die Daten, die gemeinsam genutzt werden müssen, werden im Prototyp definiert, und die Daten, die nicht gemeinsam genutzt werden müssen, werden in den Konstruktor geschrieben ​​

Das obige ist der detaillierte Inhalt vonDie Beziehung zwischen JS-Konstruktor, Instanzobjekt und Prototypobjekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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