Dieser Artikel stellt hauptsächlich die verschiedenen Möglichkeiten und Vor- und Nachteile von JavaScript zum Erstellen von Objekten vor Es werden hauptsächlich 5 Möglichkeiten vorgestellt mehr Weiter
Vorne geschrieben
In diesem Artikel werden verschiedene Möglichkeiten zum Erstellen von Objekten sowie deren Vor- und Nachteile erläutert.
Aber Hinweis:
Dieser Artikel ist eher eine Notiz, weil „JavaScript Advanced Programming“ so gut geschrieben ist!
1. Fabrikmuster
function createPerson(name) { var o = new Object(); o.name = name; o.getName = function () { console.log(this.name); }; return o; } var person1 = createPerson('kevin');
Nachteile: Das Objekt kann nicht erkannt werden, da alle Instanzen auf einen Prototyp verweisen
2. KonstruktorMuster
function Person(name) { this.name = name; this.getName = function () { console.log(this.name); }; } var person1 = new Person('kevin');
Vorteile: Instanzen können als spezifischer Typ identifiziert werden
Nachteile: Jedes Mal wird eine Instanz erstellt , jede Methode muss einmal erstellt werden
2.1 Konstruktormusteroptimierung
function Person(name) { this.name = name; this.getName = getName; } function getName() { console.log(this.name); } var person1 = new Person('kevin');
Vorteile: Lösen Sie das Problem, dass jede Methode neu erstellt werden muss
Nachteile: Wie heißt Kapselung...
function Person(name) { } Person.prototype.name = 'keivn'; Person.prototype.getName = function () { console.log(this.name); }; var person1 = new Person();
Vorteile: Die Methode wird nicht neu erstellt Erstellen
Nachteile: 1. Alle Eigenschaften und Methoden werden gemeinsam genutzt 2. Parameter können nicht initialisiert werden
3.1 Optimierung des Prototypmodus
function Person(name) { } Person.prototype = { name: 'kevin', getName: function () { console.log(this.name); } }; var person1 = new Person();
Vorteile: bessere Kapselung
Nachteile: Prototyp neu geschrieben und Konstruktorattribut verloren gegangen
3.2 Optimierung des Prototypmodus
function Person(name) { } Person.prototype = { constructor: Person, name: 'kevin', getName: function () { console.log(this.name); } }; var person1 = new Person();
Vorteile: Die Instanz kann ihren Konstruktor über das Konstruktorattribut finden
Nachteile: Der Prototypmodus hat immer noch die Nachteile
4 Konstrukteursmuster und Prototypenmuster sind zwei Schwerter in einem.
Vorteile: Gemeinsames Teilen, privat privat, die am weitesten verbreitete MethodeNachteile: Manche Leute möchten einfach alles zusammen schreiben, das heißt, bessere Kapselungseigenschaftenfunction Person(name) { this.name = name; } Person.prototype = { constructor: Person, getName: function () { console.log(this.name); } }; var person1 = new Person();
Hinweis: Bei Verwendung des dynamischen Prototypmodus können Sie den Prototyp nicht mit Objektliteralen überschreiben
Erklärung Warum:function Person(name) { this.name = name; if (typeof this.getName != "function") { Person.prototype.getName = function () { console.log(this.name); } } } var person1 = new Person();
function Person(name) { this.name = name; if (typeof this.getName != "function") { Person.prototype = { constructor: Person, getName: function () { console.log(this.name); } } } } var person1 = new Person('kevin'); var person2 = new Person('daisy'); // 报错 并没有该方法 person1.getName(); // 注释掉上面的代码,这句是可以执行的。 person2.getName();
Sehen wir uns die Implementierungsschritte von new an:
Erstellen Sie zuerst ein neues Objekt
Richten Sie dann den Prototyp des Objekts auf Person .prototyp
Dann gibt Person.apply(obj)
dieses Objekt zurück
Beachten Sie dies Überprüfen Sie zu diesem Zeitpunkt die Implementierungsschritte von apply. Zu diesem Zeitpunkt wird der Inhalt der if-Anweisung ausgeführt. Beachten Sie, dass das Prototypattribut des Konstruktors auf den Prototyp der Instanz verweist Methode zum direkten Überschreiben von Person.prototype. Der Wert des Prototyps der Instanz person1 zeigt weiterhin auf den vorherigen Prototyp, nicht auf Person.prototype. Der vorherige Prototyp hatte keine getName-Methode, daher wurde ein Fehler gemeldet!
5.1 Parasitäres Konstruktormuster
function Person(name) { this.name = name; if (typeof this.getName != "function") { Person.prototype = { constructor: Person, getName: function () { console.log(this.name); } } return new Person(name); } } var person1 = new Person('kevin'); var person2 = new Person('daisy'); person1.getName(); // kevin person2.getName(); // daisy
Parasitäres Konstruktormuster, ich persönlich denke, es sollte so gelesen werden:
function Person(name) { var o = new Object(); o.name = name; o.getName = function () { console.log(this.name); }; return o; } var person1 = new Person('kevin'); console.log(person1 instanceof Person) // false console.log(person1 instanceof Object) // true
Mit anderen Worten, unter dem Deckmantel eines Konstruktors versuchen Sie, etwas wie ein Schaf über den Kopf eines anderen zu verkaufen. Sie sehen, die mit „instanceof“ erstellte Instanz kann nicht auf den Konstruktor verweisen!
Diese Methode kann unter besonderen Umständen angewendet werden. Wenn wir beispielsweise ein spezielles
Arraymit zusätzlichen Methoden erstellen möchten, aber den
Array-Konstruktor nicht direkt ändern möchten, können wir so schreiben:
Sie werden feststellen, dass das sogenannte parasitäre Konstruktormuster beim Erstellen von Objekten ein neues verwendet als das Fabrikmuster. Tatsächlich sind die Ergebnisse beider Muster gleich.
function SpecialArray() { var values = new Array(); for (var i = 0, len = arguments.length; i len; i++) { values.push(arguments[i]); } values.toPipedString = function () { return this.join("|"); }; return values; } var colors = new SpecialArray('red', 'blue', 'green'); var colors2 = SpecialArray('red2', 'blue2', 'green2'); console.log(colors); console.log(colors.toPipedString()); // red|blue|green console.log(colors2); console.log(colors2.toPipedString()); // red2|blue2|green2
Verwenden Sie diesen Modus nicht, wenn andere Modi verwendet werden können.
Aber es ist erwähnenswert, dass die
Schleifeim obigen Beispiel:
ersetzt werden kann durch:
for (var i = 0, len = arguments.length; i len; i++) { values.push(arguments[i]); }
5.2 Stabiles Konstruktormuster
values.push.apply(values, arguments);
Das sogenannte sichere Objekt bezieht sich auf Es handelt sich um ein Objekt, das keine öffentlichen Eigenschaften hat und dessen Methoden nicht
verweisen
function person(name){ var o = new Object(); o.sayName = function(){ console.log(name); }; return o; } var person1 = person('kevin'); person1.sayName(); // kevin person1.name = "daisy"; person1.sayName(); // kevin console.log(person1.name); // daisy
Es gibt zwei Unterschiede zum parasitären Konstruktormuster:
Die neu erstellte Instanzmethode verweist nicht darauf
Verwendet nicht new Operatorruft Konstruktor auf
Sichere Objekte eignen sich am besten für einige sichere Umgebungen.
Das sichere Konstruktormuster ist dasselbe wie das Fabrikmuster und kann den Typ des Objekts nicht identifizieren.
Das obige ist der detaillierte Inhalt vonEin tiefgreifendes Verständnis der vielen Möglichkeiten, wie JavaScript Objekte erstellt, und ihrer Vor- und Nachteile. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!