Detaillierte Erläuterung von JavaScript-Konstruktoren und -Prototypen mit Beispielen

Dieser Artikel vermittelt Ihnen relevantes Wissen über JavaScript. Er stellt hauptsächlich Probleme im Zusammenhang mit Konstruktoren und Prototypen sowie prototypbezogene Inhalte vor. Ich hoffe, dass er für alle hilfreich ist.

【Verwandte Empfehlungen: javaScript Video Tutorial, Web Front-End】

1. Es gibt Speicherverschwendung. Das Problem:

Wenn zwei oder mehr Objekte vorhanden sind, wird der Raum eines komplexen Datentyps mehrmals geöffnet Das Prototypobjekt wird hauptsächlich gelöst. Das Problem der Speicherverschwendung wird beseitigt. Die vom Konstruktor über den Prototyp zugewiesenen Funktionen werden von allen Objekten gemeinsam genutzt. Jeder Konstruktor in JavaScript verfügt über eine Prototypeigenschaft, die auf ein anderes Objekt verweist. Dieser Prototyp ist ein Objekt und alle Eigenschaften und Methoden des Prototypobjekts sind Eigentum des Konstruktors. Zu diesem Zeitpunkt können Sie mithilfe des Prototyps Methoden einfügen, die von allen Instanzobjekten des Objekts verwendet werden.

Object prototype

_ proto_

Object

Objects haben ein Attribut _ proto_ points für das Prototyp -Prototyp -Objekt des Konstruktors. Konstruktor Prototyp Prototyp Die Attribute und Methoden von Objekten liegen daran, dass das Objekt einen _ Prototyp_ Prototyp hat.

sy's _ proto_ und sym's _ proto_ sind die gleichen Methodensuchregeln: Schauen Sie sich zuerst sy an und prüfen Sie, ob es eine sing-Methode für das sym-Objekt gibt. Wenn ja, führen Sie sing für dieses Objekt aus, da es _ _ proto gibt _ _, gehen Sie zur Existenz des Konstruktor-Prototypobjekts Prototype und gehen Sie zum Konstruktor-Prototypobjekt Prototype, um die Sing-Methode zu finden (Um es einfach auszudrücken: Ich verwende sie, wenn ich sie habe, wenn nicht, werde ich danach suchen in der Funktion „Prototypobjekt“ und „Beim Erstellen des Objekts wird automatisch eine Eigenschaft erstellt.“ Beide verweisen auf dasselbe leere Objekt. 1.2 Konstruktor Konstruktor Konstruktor Konstruktor Objektprototyp (_ ) und Konstruktor (Prototyp) sind beide im Prototypobjekt.

Beide haben einen Konstruktor. Wenn der Prototyp in Form eines Objekts hinzugefügt wird, hat sich der Prototypzeiger geändert und zeigt auf ein neues Prototypobjekt Sie müssen es nur einen Moment manuell ausrichten

2. Prototypenkette

2.1 Regeln für die Mitgliedersuche in js

Überprüfen Sie beim Zugriff auf die Eigenschaften (einschließlich Methoden) eines Objekts zunächst, ob das Objekt selbst über die Eigenschaft verfügt. Wenn nicht, suchen Sie nach seinem Prototyp (d. h. dem Prototyp-Prototypobjekt, auf das ._ proto _ zeigt). Wenn es noch nicht existiert, suchen Sie nach dem Prototyp des Prototypobjekts (dem Prototypobjekt von Object). Und so weiter, bis Object gefunden wird (null).

2.2 Das Prototypobjekt zeigt auf

1. Im Konstruktor zeigt dies auf die Objektinstanz shanyu

<script>
        function Person(uname, uage) {
            this.uname = uname;
            this.uage = uage;
        }
        // 声明一个变量然后验证this指向是不是和实例化对象相同
        var that;
        Person.prototype.skill = function () {
            console.log('我会吃饭');
            that = this;
        }
        var shanyu = new Person('山鱼', 30);
        shanyu.skill();
        console.log(that === shanyu);
    </script>

2.3 Erweitern Sie das integrierte Objekt

Sie können das Prototypobjekt zum Ändern verwenden Das ursprüngliche integrierte Objekt erweitert benutzerdefinierte Methoden. Integrierte Array- und String-Objekte können das Prototypobjekt nicht mit der Operation Array.prototype = {} überschreiben sei nur die Array.prototype-Methode.

3.Funktion aufrufen

Rufen Sie diese Funktion auf und ändern Sie den Zeiger this, wenn die Funktion ausgeführt wird. Es gibt drei Parameter:

thisArg Die aktuell aufrufende Funktion zeigt auf arg1, arg2 und andere übergebene Parameter

 <script>
        //  自定义对象应用，给Array添加一个自定义方法
        Array.prototype.sum = function () {
            var sum = 0;
            for (var i = 0; i < this.length; i++) {
                sum += this[i];
            }
            return sum;
        }
        var arr = [1, 2, 3, 4];
        console.log(arr.sum());
    </script>

4. Durch Eingabe können wir sehen, dass dies auf Son verweist, d Vor es6 gab es keine Erweiterungen, daher können Sie die Kombination aus

Konstruktor und Modellobjekt

verwenden, um Vererbungsvorgänge durchzuführen

    <script>
        function sing(x,y) {
            console.log("a~a~给我已被忘情水");
            console.log(this);
            console.log(x+y);
        }
        var fn = {
            name: '山鱼'
        }
        // call()可以改变这个函数的this指向此时这个函数的this就指向了o这个对象
        sing.call(fn,1,2)
    </script>

[Verwandte Empfehlungen:

JavaScript-Video-Tutorial

, Web-Frontend

]

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung von JavaScript-Konstruktoren und -Prototypen mit Beispielen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!