Heim > Web-Frontend > js-Tutorial > Hauptteil

Einführung in das Builder-Muster von JavaScript-Entwurfsmustern_Javascript-Fähigkeiten

WBOY
Freigeben: 2016-05-16 16:23:52
Original
1281 Leute haben es durchsucht

Anleitung für den Builder-Modus

1. Trennen Sie die Konstruktion eines komplexen Objekts von seiner Darstellung, sodass derselbe Erstellungsprozess unterschiedliche Darstellungen haben kann.
2. Beschreibung in objektorientierter Sprache, Hauptrolle:

1>. Die Builder-Schnittstellenklasse definiert ein einheitliches und bedienbares Verhalten des Builders [Worker], der ein komplexes Strukturobjekt darstellt 2>. ConcreteBuilder wird verwendet, um verschiedene Formen von Instanzobjekten von Builder zu erstellen [implementieren], um verschiedene Darstellungen von Builder darzustellen;
3>. Der Direktor wird verwendet, um den Ausführungsprozess und die Form der Builder-Instanz zu leiten, um sie von der Leistung der Builder-Instanz zu trennen, und um die Builder-Instanz bei der Erstellung und Generierung von Produktergebnissen gemäß einer bestimmten Regelsequenz anzuleiten.
4>. Das von ResultObject erstellte Ergebnis generiert ein Ergebnisobjekt; dies ist das Ergebnis, das vom jeweiligen Ersteller gemäß den Anweisungen von Director erstellt wurde;

3. Das Builder-Modell ist eigentlich ein Commander, ein Builder und ein Kunde, der den Commander verwendet, um bestimmte Builder zur Arbeit aufzurufen und Ergebnisse von den spezifischen Buildern zu erhalten

4. Builder-Modus, Simulationsszenario: [Es ist gut, ein Beispiel zu sehen, das die Beschreibung des Builder-Modus veranschaulicht]

Angenommen, eine Familie möchte ein Haus bauen, aber der Eigentümer oder andere Familienmitglieder wissen nicht, wie man ein Haus baut, also muss das Team, das das Haus baut, auch einen Vorarbeiter für die Hypothek einstellen das Haus nach den Vorstellungen des Eigentümers bauen, und der Vorarbeiter wird es entsprechend den Anforderungen des Eigentümers entwerfen und die Arbeiter fragen, wie es zu machen ist;

Der Vorarbeiter sagte, dass der erste Schritt darin besteht, den Gesamtrahmen des Hauses zu errichten, der zweite Schritt darin besteht, das Schlafzimmer zu bauen, der dritte Schritt darin besteht, die Küche zu dekorieren, der vierte Schritt darin besteht, den Bau des Wohnzimmers abzuschließen und Dekoration, der fünfte Schritt...

Der Vorarbeiter tut nichts, aber der jeweilige Bauunternehmer muss die Anforderungen des Vorarbeiters befolgen und den ersten Schritt, den zweiten Schritt, bauen, bis das gesamte Haus fertiggestellt ist

Der Schöpfer muss über alle Fähigkeiten verfügen, um dieses Haus zu erschaffen, das heißt, das Skelett zu bauen, das Schlafzimmer zu dekorieren usw., das heißt, was der Baumeister tut, oder die Fähigkeit, die er hat, muss größer sein als oder gleich dem, was der Kommandant etwas oder eine Fähigkeit benötigt

Das heißt, der Kommandant ist ein Organisator und der Baumeister stellt Fähigkeiten zur Verfügung

5. In einer schwachen Sprache wie JavaScript gibt es keine Schnittstelle. Ignorieren Sie also einfach die Schnittstellendefinitionsschicht, erstellen Sie direkt einen bestimmten Builder und erstellen Sie dann eine Führungsklasse, um den Builder zurückzurufen

Beispiel-Quellcode

1. Worker Builder X:

Code kopieren

Der Code lautet wie folgt: Funktion workerBuilder() { This.workOne = function() {              //Baue das Grundgerüst des Hauses
}
This.workTwo=function() {
            //Baue ein Schlafzimmer
}
This.workThree=function() {
             //Eine Küche bauen
}
This.workFour=function() {
            //Baue ein Wohnzimmer
}
//....
 
This.getResult = function() {
                                                            //Das Haus fertigstellen
  var house = new House();
​​​ //house.HouseFrame ...
  Rückkehr nach Hause; 
}
}




workBuilder ist eine spezielle Builder-Klasse, workOne und Two sind Dinge, die erledigt werden müssen, Skelette bauen usw.;
Natürlich können Sie mehrere weitere WorkBuilder erstellen, um die Arbeitskräfte darzustellen, aber der Arbeitsinhalt ist derselbe.


2. Commander-Klasse

Code kopieren

Der Code lautet wie folgt: Funktion Director() { This.construct = function(builder) { ​​​​​ builder.workOne();
​​​​​ builder.workTwo();
​​​​​ builder.workThree();
            builder.workFour();
               //...
//Die Reihenfolge des oben genannten Inhalts kann festgelegt werden, und die Arbeitselemente können ebenfalls festgelegt werden
}
}

Die Anleitungsmethode unter der Commander-Klasse enthält einen Rückrufverweis auf den Builder, der mehrere oder alle Arbeitsinhalte des Builders umfasst und organisiert, was die Builder-Arbeiter tun müssen

3. Produkthaus

Code kopieren Der Code lautet wie folgt:
Funktion House() {
This.HouseFrame = '';
This.Room = '';
This.Kitchen = '';
This.LivingRoom = '';
//...
}

4. So verwenden Sie


Code kopieren Der Code lautet wie folgt:
var builder = new workBuilder();
var Director = neuer Director();
Director.construct(builder);
var house = builder.getResult();


Der vierte Schritt entspricht dem Kunden: Der Hausbesitzer bittet den Direktor, das Haus zu bauen, aber der Vorarbeiter unternimmt nichts, also beauftragt er die Bauherren, das Haus zu bauen erhält den Bau von den Arbeitern. Schönes Haus;

Weitere Anweisungen

Der Builder-Modus eignet sich besser für Situationen, in denen der Inhalt [Abstraktion] komplex ist und die tatsächliche Szenenleistung unterschiedlich ist, z. B. bei inkonsistenten Arbeitsinhalten oder -abläufen, z. B. bei den täglichen Lebensprozessen aller, und ähnlichen Dingen Szenarien; durch die Lehrerebene können Sie die Anzahl der Situationen reduzieren, in denen es viele ähnliche Arbeitsplätze gibt, aber die Konstruktionsabstraktion tatsächlicher Objekte erheblich reduzieren kann;
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