It’s #FrontendFriday – Coding Patterns JavaScript

Zum ersten Mal in der Geschichte der Webfrontend FG findet eine Blogreihe statt. Ja ihr habt richtig gehört, eine Blogreihe. In den nächsten 8 Beiträgen wollen wir euch einige gängige Entwurfsmuster aus dem Pool der GoF (Gang of Four) vorstellen sowie den entsprechenden Stellenwert aufzeigen. Freut euch auf sehr spannende JavaScript Patterns von verschiedenen Autoren.

Was sind Patterns?

Unter einem Entwurfsmuster bezeichnet ein:e Softwareentwickler:in typischerweise einen bestimmten Codebaustein, welcher sich als bewährte Lösung/Herangehensweise für ein gängiges, wiederkehrendes Problem erwiesen hat. Jede Programmiersprache hat ihre eigenen Entwurfsmuster. Auch JavaScript, in welcher zwei Arten der Objektorientierung existieren: die prototypische oder die ES6-Klassensyntax. Wir wollen in den nächsten Wochen jedoch nicht für jede Musterausprägung alle Varianten der Objektorientierung durcharbeiten, sondern das ganze etwas abwechslungsreicher gestalten. Jedem Autor ist es somit selber überlassen, welche Herangehensweise derjenige wählt.

Warum Patterns?

Entwurfsmuster sollten nicht um des Entwurfsmusters willen eingesetzt werden. Beachtet man diesen Grundsatz, so werden sich auch folgende Vorteile aus dem Einsatz ergeben. Das schnellere und effizientere Arbeiten bei komplexen Problemen fällt mir ohne großartig darüber nachzudenken ein. Auch positive Effekte auf das Zusammenarbeiten im Team sind vorstellbar. Flankiert wird das Ganze durch die leichte Erweiterbarkeit, Wartbarkeit sowie Flexibilität. Auf die weiteren Vorteile will ich auch nicht mehr im Detail eingehen, das würde etwas den Rahmen des Eröffnungsbeitrags sprengen.

Welche Patterns stellen wir euch vor?

Erzeugungsmuster (Creational Design Patterns)

• Factory Method – Erzeugt Objekte an zentraler Stelle
• Builder – Vereinfacht komplexe Prozesse beim Erzeugen von Objekten

Strukturmuster (Structural Design Patterns)

• Adapter – Passt die Schnittstelle einer Klasse an eine andere Schnittstelle an
• Facade – Bietet eine einheitliche Schnittstelle für eine Menge von Schnittstellen eines Subsystems an

Verhaltensmuster (Behavioral Design Patterns)

• Mediator (in Form Publish Subscribe) – Koordiniert das Zusammenspiel mehrerer Objekte
• Memento – Speichert den Zustand eines Objekts, so dass das Objekt später in diesen Zustand zurückversetzt werden kann
• Observer – Ermöglicht es, Objekte bei Zustandsänderungen anderer Objekte zu benachrichtigen
• State – Ermöglicht es, das Verhalten eines Objekts abhängig vom Zustand des Objekts anzupassen

Die Webfrontend FG wünscht euch viel Spaß & ein wunderschönes Wochenende!