Was ist ein Muster
Ich habe mich vor einiger Zeit auf die Abschlussprüfung vorbereitet, aber es war eine mühsame Person und ich war sehr beschäftigt. Ich hatte keine Zeit, den Artikel zu aktualisieren. Heute werde ich Ihnen von den Entwurfsmustern in JavaScript erzählen.
Zunächst müssen wir wissen, dass Muster eine wiederverwendbare Lösung ist, während Anti-Muster eine schlechte Lösung für ein bestimmtes Problem ist.
Häufige Beispiele für Anti-Muster von JS
1. Pass an SetTimeout und setInterval vorbei, nicht auf Funktionen, die die interne Verwendung von Eval () auslösen.
2. Definieren Sie eine große Anzahl von Variablen im globalen Kontext, um den globalen Namespace zu verschmutzen
3. Ändern Sie den Prototyp der Objektklasse
V.
5. Missbrauchsdokument.Write. Wenn Sie document.write nach dem Laden der Seite ausführen, schreibt sie die Seite, auf der wir uns befinden, um.
Kategorie von Entwurfsmustern
Erstellen eines Designmusters
Kreative Designmuster konzentrieren sich auf die Umgang mit Objekterstellungsmechanismen, um Objekte auf eine Weise zu erstellen, die zu einer bestimmten Situation passt. Zu den Attributen, die in diese Kategorie fallen, gehören:
Konstruktorkonstruktor, Fabrikfabrik, abstrakte Abstraktion, Prototypprototyp, Singleton Singleton und Builder Generator
Strukturelles Designmuster
Strukturmuster beziehen sich auf Objektkombinationen und können häufig verwendet werden, um einfache Möglichkeiten zu finden, um Beziehungen zwischen verschiedenen Objekten aufzubauen.
Zu den Mustern, die in diese Kategorie fallen, gehören:
Dekorateurdekorateurin, Fassade, Fliegengewichtszyklopädie, Adapteradapter und Proxy -Proxy
Verhaltensdesignmuster
Verhaltensmuster konzentrieren sich auf die Verbesserung oder Vereinfachung der Kommunikation zwischen verschiedenen Objekten im System.
Verhaltensmuster umfassen:
Iterator Iterator, Mediatormediator, Beobachterbeobachter und Besucherbesucher
Fabrikmodus
Um das Problem mehrerer ähnlicher Objektdeklarationen zu lösen, können wir eine Methode namens Fabrikmuster verwenden, nämlich das Problem der Instanziierung von Objekten mit einer großen Anzahl von Duplikationen.
Die Codekopie lautet wie folgt:
<script type = "text/javaScript">
Funktion createObject (Name, Alter, Beruf) {// zentrale sofortige Funktion {//
var obj = neues Objekt ();
obj.name = name;
obj.age = Alter;
obj.profession = Beruf;
obj.move = function () {
zurück diesen.namen + 'at' + this.age + 'in' + this.profession;
};
Rückkehr obj;
}
var test1 = createObject ('trigkit4', 22, 'Programmierer'); // Erste Instanz
var test2 = CreateObject ('Mike', 25, 'Ingenieur'); // Die zweite Instanz
Alert (test1.move ());
Alert (test2.move ());
</script>
Kategorie des Fabrikmodells
Das Werksmuster ist in einfache Fabriken, abstrakte Fabriken und intelligente Fabriken unterteilt. Das Werksmuster erfordert die Verwendung eines Konstruktors, ohne es anzuzeigen.
Einfaches Werksmuster: Verwenden Sie eine Klasse (normalerweise ein Monomer), um eine Instanz zu generieren.
Komplexes Werksmuster: Verwenden Sie Unterklassen, um zu bestimmen, welche spezifische Klasseninstanz eine Mitgliedsvariable sein sollte.
Die Vorteile des Fabrikmodells
Der Hauptvorteil besteht darin, dass die Kopplung zwischen Objekten durch Verwendung von technischen Methoden anstelle neuer Schlüsselwörter eliminieren kann. Konzentrieren Sie alle sofortigen Code an einem Ort, um eine Code -Duplikation zu verhindern.
Nachteile des Fabrikmodells
Die meisten Klassen werden am besten mit neuen Schlüsselwörtern und Konstruktoren verwendet, mit denen der Code das Lesen erleichtert. Anstatt die Werksmethode zu überprüfen.
Das Fabrikmuster löst das Problem der wiederholten Instanziierung, aber es gibt ein anderes Problem, das heißt das Problem, weil es unmöglich ist, herauszufinden, welches Instanz des Objekts sie sind.
Die Codekopie lautet wie folgt:
Alarm (Typof test1); //Objekt
ALERT (Test1 InstanceOf Objekt); //WAHR
Wann können Sie den Werksmodus verwenden?
Der Werksmodus wird hauptsächlich in den folgenden Szenarien verwendet:
1. Wenn ein Objekt oder eine Komponente eine hohe Komplexität beinhaltet
2. Wenn es notwendig ist, leicht unterschiedliche Instanzen von Objekten gemäß den verschiedenen Umgebungen zu generieren, in denen sie sich befinden
3. Wenn Sie sich mit vielen kleinen Objekten oder Komponenten befassen, die dieselben Attribute teilen
Konstruktormodus
In ECMascript können Konstruktoren (Konstruktoren) verwendet werden, um bestimmte Objekte zu erstellen. Dieser Modus kann einfach das Problem lösen, dass der obige Werksmodus Objektinstanzen nicht erkennen kann.
Die Codekopie lautet wie folgt:
<script type = "text/javaScript">
Funktion Car (Modell, Jahr, Meilen) {// Konstruktormodus
this.model = Modell;
this.year = Jahr;
this.miles = Meilen;
this.run = function () {
zurück this.model + "hat" + this.miles + "meilen";
}
}
var Benz = New Car ('Benz', 2014.20000);
var bmw = neues Auto ("BMW", 2013, 12000);
Alarm (Benzinstanz des Autos); // Ich identifiziere es eindeutig als untergeordnetes Auto, wahr
console.log (Benz.run ());
console.log (bmw.run ());
</script>
Die Verwendung der Konstruktormethode löst das Problem der wiederholten Instanziierung und das Problem der Objekterkennung. Der Unterschied zwischen diesem Muster und dem Fabrikmuster ist:
1. erstellen Objekt (neues Objekt ()), das nicht von der Konstruktor -Methode angezeigt wird;
2. Zuwenden Sie diesem Objekt direkt Attribute und Methoden;
3. Keine Rückgabeerklärung.
Es gibt einige Spezifikationen für Konstruktormethoden:
1. Der Funktionsname und der instanziierte Konstruktor sind gleich und aktiviert (PS: Nicht obligatorisch, aber das Schreiben hilft dabei, zwischen Konstruktoren und gewöhnlichen Funktionen zu unterscheiden);
2. Um ein Objekt über einen Konstruktor zu erstellen, muss der neue Bediener verwendet werden.
Da ein Objekt über einen Konstruktor erstellt werden kann, woher kam dieses Objekt und woher wurde ein neues Objekt () ausgeführt? Der Ausführungsprozess ist wie folgt:
1. Wenn der Konstruktor verwendet wird und der neue Konstruktor () verwendet wird, wird das neue Objekt () im Hintergrund ausgeführt;
2. Geltungsbereich Der Konstruktor in ein neues Objekt (dh das von New Object ()) erstellte Objekt und dies repräsentiert in der Funktionsorganisation das von New Object () erzeugte Objekt.
3. Führen Sie den Code innerhalb des Konstruktors aus;
V.
Konstruktor mit Prototyp (Konstruktor)
Es gibt eine Eigenschaft namens Prototyp in JS. Nach dem Aufrufen des JS -Konstruktors, um ein Objekt zu erstellen, hat das neue Objekt alle Eigenschaften des Konstruktorprototyps. Auf diese Weise können mehrere Autoobjekte erstellt und auf denselben Prototyp zugegriffen werden.
Die Codekopie lautet wie folgt:
<script type = "text/javaScript">
Funktion Car (Modell, Jahr, Meilen) {
this.model = Modell;
this.year = Jahr;
this.miles = Meilen;
}
Car.prototype.run = function () {
zurück this.model + "hat" + this.miles + "meilen";
};
var Benz = New Car ('S350', 2010.20000);
var ford = New Car ('Ford', 2012, 12000);
console.log (Benz.run ()); // "S350 hat 20000 Meilen gemacht"
console.log (ford.run ());
</script>
Jetzt kann eine einzelne Instanz von Run () unter allen Autoobjekten geteilt werden.