Was ist ein Muster?
Ich habe mich vor einiger Zeit auf die Abschlussprüfung vorbereitet und hatte wirklich keine Zeit, den Artikel zu aktualisieren. Heute werde ich mit Ihnen über die Entwurfsmuster in JavaScript sprechen.
Zuallererst müssen wir wissen: Ein Muster ist eine wiederverwendbare Lösung, während ein Anti-Muster eine schlechte Lösung für ein bestimmtes Problem ist.
Häufige Beispiele für js-Anti-Muster
1. Übergeben Sie Zeichenfolgen an setTimeout und setInterval anstelle von Funktionen, was die interne Verwendung von eval() auslöst.
2. Definieren Sie eine große Anzahl von Variablen im globalen Kontext, um den globalen Namespace
zu verschmutzen
3. Ändern Sie den Prototyp der Object-Klasse
4. Verwenden Sie js in Inline-Form. Der in die HTML-Datei eingebettete js-Code kann nicht in externe Unit-Test-Tools eingebunden werden.
5. Missbrauch von document.write. Wenn document.write nach dem Laden der Seite ausgeführt wird, wird die Seite, auf der wir uns befinden, neu geschrieben. Wenn Sie stattdessen document.create verwenden können, versuchen Sie, document.write nicht zu verwenden.
Kategorien von Designmustern
Kreatives Designmuster
Kreative Designmuster konzentrieren sich auf den Umgang mit Objekterstellungsmechanismen, um Objekte auf eine Weise zu erstellen, die für eine bestimmte Situation geeignet ist. Zu den Eigenschaften, die in diese Kategorie fallen, gehören:
Konstrukteur, Fabrik, Zusammenfassung, Prototyp, Singleton und Builder
Strukturelles Entwurfsmuster
Bei Strukturmustern geht es um die Objektzusammensetzung und sie können häufig verwendet werden, um einfache Wege zum Herstellen von Beziehungen zwischen verschiedenen Objekten zu finden.
Zu den Mustern, die in diese Kategorie fallen, gehören:
Dekorateur, Fassadengestaltung, Fliegengewicht, Adapteradapter und Proxy-Agent
Verhaltensdesignmuster
Verhaltensmuster konzentrieren sich auf die Verbesserung oder Vereinfachung der Kommunikation zwischen verschiedenen Objekten im System.
Zu den Verhaltensmustern gehören:
Iterator, Mediator, Beobachter und Besucher
Werksmodus
Um das Problem mehrerer ähnlicher Objektdeklarationen zu lösen, können wir eine Methode namens Factory-Muster verwenden. Diese Methode dient dazu, das Problem einer großen Anzahl von Duplikaten beim Instanziieren von Objekten zu lösen.
Klassifizierung von Fabrikmustern
Der Factory-Modus ist in einfache Factory, abstrakte Factory und Smart Factory unterteilt und erfordert nicht explizit die Verwendung eines Konstruktors.
Einfaches Factory-Muster: Verwenden Sie eine Klasse (normalerweise einen Singleton), um Instanzen zu generieren.
Komplexes Fabrikmuster: Verwenden Sie Unterklassen, um zu bestimmen, welche spezifische Klasseninstanz eine Mitgliedsvariable sein soll.
Vorteile des Fabrikmodells
Der Hauptvorteil besteht darin, dass Sie die Kopplung zwischen Objekten beseitigen können, indem Sie technische Methoden anstelle des neuen Schlüsselworts verwenden. Verhindern Sie Codeduplizierung, indem Sie den gesamten Instanziierungscode an einem Ort zentralisieren.
Nachteile des Werksmodells
Für die meisten Klassen ist es am besten, das neue Schlüsselwort und den Konstruktor zu verwenden, wodurch der Code einfacher und leichter lesbar wird. Anstatt sich die Fabrikmethode ansehen zu müssen, um das herauszufinden.
Das Factory-Muster löst das Problem der wiederholten Instanziierung, es gibt jedoch noch ein anderes Problem, nämlich das Problem der Identifizierung, da es unmöglich ist herauszufinden, von welchem Objekt sie Instanzen sind.
Alert(typeof test1); //Objekt
Alert(test1 Instanz des Objekts); //true
Wann sollte das Fabrikmuster verwendet werden?
Der Werksmodus wird hauptsächlich in den folgenden Szenarien verwendet:
1. Wenn Objekte oder Komponenten eine hohe Komplexität aufweisen
2. Wenn Sie je nach Umgebung problemlos verschiedene Instanzen eines Objekts generieren müssen
3. Beim Umgang mit vielen kleinen Objekten oder Komponenten, die die gleichen Eigenschaften haben
Konstruktormuster
Konstruktor (Konstruktormethode) kann in ECMAScript verwendet werden, um bestimmte Objekte zu erstellen. Dieser Modus kann lediglich das Problem lösen, dass der obige Werksmodus keine Objektinstanzen identifizieren kann.
Die Verwendung der Konstruktormethode löst nicht nur das Problem der wiederholten Instanziierung, sondern auch das Problem der Objekterkennung. Der Unterschied zwischen diesem Modus und dem Factory-Modus ist:
1. Die Konstruktormethode erstellt kein Objekt explizit (new Object());
2. Weisen Sie diesem Objekt direkt Eigenschaften und Methoden zu;
3. Es gibt keine Rückgabeerklärung.
Es gibt einige Spezifikationen für Konstruktormethoden:
1. Der Funktionsname und der Name des Instanziierungskonstruktors sind gleich und werden groß geschrieben (PS: Es ist nicht obligatorisch, aber diese Schreibweise hilft, den Konstruktor von der gewöhnlichen Funktion zu unterscheiden);
2. Um ein Objekt über einen Konstruktor zu erstellen, müssen Sie den neuen Operator verwenden.
Woher kommt dieses Objekt und wo wird new Object() ausgeführt, da Objekte über Konstruktoren erstellt werden können? Der Ausführungsprozess ist wie folgt:
1. Wenn ein Konstruktor verwendet wird und neuer Konstruktor() verwendet wird, wird new Object() im Hintergrund ausgeführt
2. Geben Sie dem neuen Objekt (d. h. dem von new Object() erstellten Objekt) den Gültigkeitsbereich des Konstruktors, und dieser stellt im Funktionskörper das von new Object() erstellte Objekt dar.
3. Führen Sie den Code innerhalb des Konstruktors aus;
4. Geben Sie das neue Objekt zurück (Rückkehr direkt im Hintergrund).
Konstrukteur mit Prototyp
In js gibt es ein Attribut namens Prototyp. Nach dem Aufruf des js-Konstruktors zum Erstellen eines Objekts verfügt das neue Objekt über alle Eigenschaften des Konstruktorprototyps. Auf diese Weise können mehrere Car-Objekte erstellt werden und auf denselben Prototyp zugreifen.
Code kopieren
