Fortgeschrittene Spieleentwicklung mit JavaScript

Bloggen

Fortgeschrittene Spieleentwicklung mit JavaScript

Vererbung und Komposition in der Spieleentwicklung

In früheren Lektionen mussten Sie sich nicht viel Gedanken über die Designarchitektur der von Ihnen erstellten Apps machen, da die Projekte einen sehr kleinen Umfang hatten. Wenn Ihre Anwendungen jedoch an Größe und Umfang zunehmen, werden architektonische Entscheidungen zu einem größeren Problem. Es gibt zwei Hauptansätze zum Erstellen größerer Anwendungen in JavaScript: Komposition oder Nachlass . Es gibt Vor- und Nachteile für beide, aber lassen Sie uns sie im Kontext eines Spiels erklären.

✅ Eines der berühmtesten Programmierbücher, das je geschrieben wurde, hat damit zu tun Designmuster .

In einem Spiel haben Sie |_+_| das sind Objekte, die auf einem Bildschirm existieren. Das heißt, sie haben einen Ort in einem kartesischen Koordinatensystem, gekennzeichnet durch ein |_+_| und |_+_| Koordinate. Wenn Sie ein Spiel entwickeln, werden Sie feststellen, dass alle Ihre Spielobjekte eine Standardeigenschaft haben, die für jedes von Ihnen erstellte Spiel gleich ist, nämlich Elemente, die sind:

    ortsbasierendDie meisten, wenn nicht alle Spielelemente sind ortsabhängig. Das bedeutet, dass sie einen Ort haben, ein |_+_| und |_+_|.beweglichDies sind Objekte, die an einen neuen Ort verschoben werden können. Dies ist normalerweise ein Held, ein Monster oder ein NPC (ein Nicht-Spieler-Charakter), aber beispielsweise kein statisches Objekt wie ein Baum.selbstzerstörerischDiese Objekte existieren nur für einen bestimmten Zeitraum, bevor sie sich zum Löschen bereit machen. Normalerweise wird dies durch ein |_+_| dargestellt oder |_+_| boolean, der der Spiel-Engine signalisiert, dass dieses Objekt nicht mehr gerendert werden soll.abkühlen„Cool-down“ ist eine typische Eigenschaft kurzlebiger Objekte. Ein typisches Beispiel ist ein Text oder ein grafischer Effekt wie eine Explosion, die nur wenige Millisekunden lang zu sehen sein soll.

✅ Denken Sie an ein Spiel wie Pac-Man. Können Sie die vier oben aufgeführten Objekttypen in diesem Spiel identifizieren?

Verhalten ausdrücken

Alles, was wir oben beschrieben haben, sind Verhaltensweisen, die Spielobjekte haben können. Wie codieren wir diese also? Wir können dieses Verhalten als Methoden ausdrücken, die entweder Klassen oder Objekten zugeordnet sind.

Klassen

Die Idee ist, |_+_| zu verwenden in Verbindung mit |_+_| um ein bestimmtes Verhalten zu einer Klasse hinzuzufügen.

✅ Vererbung ist ein wichtiges Konzept, das es zu verstehen gilt. Erfahren Sie mehr auf Artikel von MDN über Vererbung .

Per Code ausgedrückt, kann ein Spielobjekt typischerweise so aussehen:

|_+_|

✅ Nehmen Sie sich ein paar Minuten Zeit, um sich einen Pac-Man-Helden (z. B. Inky, Pinky oder Blinky) und wie er in JavaScript geschrieben werden würde, noch einmal vorzustellen.

wo kann man einen regenschirm kaufen

Komposition

Eine andere Art, mit der Objektvererbung umzugehen, ist die Verwendung Komposition . Dann drücken Objekte ihr Verhalten wie folgt aus:

|_+_|

Welches Muster soll ich verwenden?

Für welches Muster Sie sich entscheiden, bleibt Ihnen überlassen. JavaScript unterstützt diese beiden Paradigmen.

--

Ein weiteres Muster, das in der Spieleentwicklung üblich ist, befasst sich mit dem Problem des Umgangs mit der Benutzererfahrung und Leistung des Spiels.

Pub/Sub-Muster

✅ Pub/Sub steht für „publish-subscribe“

Dieses Muster geht auf die Idee ein, dass die unterschiedlichen Teile Ihrer Anwendung nichts voneinander wissen sollten. Warum ist das so? Es macht es viel einfacher zu sehen, was im Allgemeinen los ist, wenn verschiedene Teile getrennt werden. Es macht es auch einfacher, das Verhalten plötzlich zu ändern, wenn es nötig ist. Wie erreichen wir das? Wir tun dies, indem wir einige Konzepte aufstellen:

    BotschaftHinweis: Eine Nachricht ist normalerweise eine Textzeichenfolge, die von einer optionalen Nutzlast begleitet wird (ein Datenelement, das verdeutlicht, worum es in der Nachricht geht). Eine typische Nachricht in einem Spiel kann |_+_| sein.Verleger: Dieses Element veröffentlicht eine Nachricht und sendet sie an alle Abonnenten.Teilnehmer: Dieses Element hört zu auf bestimmte Nachrichten und führt eine Aufgabe als Ergebnis des Empfangs dieser Nachricht aus, wie z. B. das Abfeuern eines Lasers.

Die Implementierung ist ziemlich klein, aber es ist ein sehr mächtiges Muster. So kann es umgesetzt werden:

|_+_|

Um den obigen Code zu verwenden, können wir eine sehr kleine Implementierung erstellen:

|_+_|

Oben verbinden wir ein Tastaturereignis, |_+_| und sende die |_+_| Botschaft. Wir hören auf diese Nachricht und bewegen das |_+_| als Ergebnis. Die Stärke dieses Musters liegt darin, dass der Ereignis-Listener und der Held nichts voneinander wissen. Sie können |_+_| neu zuordnen zum |_+_| Schlüssel. Außerdem wäre es möglich, auf |_+_| etwas ganz anderes zu machen indem Sie ein paar Änderungen an |_+_| des eventEmitter vornehmen Funktion:

|_+_|

Wenn die Dinge komplizierter werden, wenn Ihr Spiel wächst, bleibt dieses Muster in seiner Komplexität gleich und Ihr Code bleibt sauber. Es wird wirklich empfohlen, dieses Muster zu übernehmen.


Herausforderung

Denken Sie darüber nach, wie das Pub-Sub-Muster ein Spiel verbessern kann. Welche Teile sollen Events ausgeben und wie soll das Spiel darauf reagieren? Jetzt haben Sie die Chance, kreativ zu werden und über ein neues Spiel nachzudenken und wie sich seine Teile verhalten könnten.

Quiz nach der Vorlesung

Quiz nach der Vorlesung

Rückblick & Selbststudium

Erfahren Sie mehr über Pub/Sub von darüber lesen .

Abtretung

Mach ein Spiel nach

Quelle des Originalartikels unter https://github.com/