JavaScript Design Patterns lernen, 2. Auflage

Kapitel 4. Anti-Patterns

Diese Arbeit wurde mithilfe von KI übersetzt. Wir freuen uns über dein Feedback und deine Kommentare: [e-mail]

Als Ingenieure können wir in Situationen geraten, in denen wir unter Zeitdruck stehen, um eine Lösung zu liefern, oder in denen Code als eine Reihe von Patches ohne Codeüberprüfung eingefügt wird. In solchen Fällen ist der Code nicht immer gut durchdacht und kann Anti-Patterns verbreiten, wie wir sie nennen. Dieses Kapitel beschreibt, was Anti-Patterns sind und warum es wichtig ist, sie zu verstehen und zu erkennen. Wir sehen uns auch einige typische Anti-Patterns inJavaScript an.

Was sind Anti-Patterns?

Wenn ein Muster eine bewährte Methode darstellt, steht ein Anti-Muster für die Lektion, die man lernt, wenn ein vorgeschlagenes Muster schief geht. Inspiriert durch das GoF-Buch Design Patterns prägte Andrew Koenig 1995 in seinem Artikel im Journal of Object-Oriented Programming, Volume 8, erstmals den Begriff Anti-Patterns. Er beschrieb Anti-Patterns als:

Ein Antipattern ist genau wie ein Pattern, nur dass es statt einer Lösung etwas liefert, das oberflächlich betrachtet wie eine Lösung aussieht, aber keine ist.

Er stellte zwei Begriffe für Anti-Muster vor. Anti-Patterns:

• Beschreibe eine schlechte Lösung für ein bestimmtes Problem, die dazu geführt hat, dass eine ungünstige Situation eingetreten ist

• Beschreibe , wie du aus der besagten Situation herauskommst und zu einer guten Lösung kommst

Zu diesem Thema schreibt Alexander über die Schwierigkeiten, eine gute Balance zwischen guter Designstruktur und gutem Kontext zu finden:

In diesen Notizen geht es um den Prozess des Designs, den Prozess des Erfindens von physischen Dingen, die eine neue physische Ordnung, Organisation, Form, als Antwort auf eine Funktion aufweisen. ... Jedes Designproblem beginnt mit dem Versuch, zwei Dinge miteinander in Einklang zu bringen: die betreffende Form und ihren Kontext. Die Form ist die Lösung für das Problem; der Kontext definiert das Problem.

Das Verständnis von Anti-Patterns ist genauso wichtig wie die Kenntnis von Design Patterns. Lassen Sie uns den Grund dafür erläutern. Wenn du eine Anwendung erstellst, beginnt der Lebenszyklus eines Projekts mit der Konstruktion. In dieser Phase wählst du wahrscheinlich aus den verfügbaren guten Entwurfsmustern aus, was du für richtig hältst. Nach der ersten Veröffentlichung muss die Anwendung jedoch gewartet werden.

Die Wartung einer bereits in Produktion befindlichen Anwendung kann eine besondere Herausforderung sein. Entwickler, die vorher noch nicht an der Anwendung gearbeitet haben, können versehentlich ein schlechtes Design in das Projekt einbringen. Wenn diese schlechten Praktiken bereits als Anti-Patterns identifiziert wurden, können Entwickler sie im Voraus erkennen und die bekannten häufigen Fehler vermeiden. Das ist ähnlich, wie die Kenntnis von Entwurfsmustern es uns ermöglicht, Bereiche zu erkennen, in denen wir bekannte und hilfreiche Standardtechniken anwenden können.

Die Qualität der sich entwickelnden Lösung wird entweder gut oder schlecht sein, je nachdem, wie viel Zeit das Team in sie investiert hat. Hier werden gut und schlecht im Kontext betrachtet - ein "perfektes" Design kann sich als Anti-Muster erweisen, wenn es im falschen Kontext angewendet wird.

Zusammenfassend lässt sich sagen, dass ein Anti-Pattern ein schlechtes Design ist, das es wert ist, dokumentiert zu werden.

Anti-Patterns in JavaScript

Entwickler entscheiden sich manchmal bewusst für Abkürzungen und temporäre Lösungen, um die Auslieferung des Codes zu beschleunigen. Diese werden in der Regel dauerhaft und häufen sich als technische Schulden an, die im Wesentlichen aus Anti-Patterns bestehen. JavaScript ist eine schwach typisierte oder untypisierte Sprache, die es einfacher macht, bestimmte Abkürzungen zu nehmen. Im Folgenden findest du einige Beispiele für Anti-Patterns, die dir in JavaScript begegnen könnten:

• Verschmutzung des globalen Namensraumes durch die Definition zahlreicher Variablen im globalenKontext.

• Übergabe von Strings statt Funktionen an setTimeout oder setInterval, da dies intern die Verwendung von eval() auslöst.

• Ändern des Prototyps der Klasse Object (dies ist ein besonders schlechtes Anti-Pattern).

• Die Verwendung von JavaScript in einem Inline-Formular, da dies unflexibel ist.

• Die Verwendung von document.write in Fällen, in denen native Document Object Model (DOM)-Alternativen wie document.createElement besser geeignet sind. document.write wurde im Laufe der Jahre stark missbraucht und hat eine Reihe von Nachteilen. Wenn er nach dem Laden der Seite ausgeführt wird, kann er die Seite, auf der wir uns gerade befinden, überschreiben, weshalb document.createElement eine weitaus bessere Wahl ist. Unter diesem Link findest du ein Live-Beispiel für diesen Vorgang. Außerdem funktioniert es nicht mit XHTML, was ein weiterer Grund dafür ist, sich für DOM-freundlichere Methoden wiedocument.createElement vorteilhaft ist.

Die Kenntnis von Anti-Patterns ist entscheidend für den Erfolg. Sobald wir lernen, solche Anti-Patterns zu erkennen, können wir unseren Code überarbeiten, um sie zu negieren, sodass sich die Gesamtqualität unserer Lösungen sofort verbessert.

Zusammenfassung

In diesem Kapitel haben wir uns mit Mustern befasst, die Probleme verursachen können, die als Anti-Muster bekannt sind, und mit Beispielen von JavaScript-Anti-Mustern. Bevor wir uns im Detail mit JavaScript-Entwurfsmustern befassen, müssen wir auf einige wichtige moderne JavaScript-Konzepte eingehen, die für unsere Diskussion über Muster relevant sind. Dies ist das Thema des nächsten Kapitels, in dem moderne JavaScript-Funktionen und -Syntax vorgestellt werden.