Hvordan du legger til metoder for klasser i HTML5-spillet ditt - dummier

Egenskaper beskriver egenskapene til et objekt i HTML 5-spillet ditt, og metoder beskriver oppførselen. En metode er en funksjon assosiert med et objekt. Du bygger metoder veldig mye som å skape en eiendom, men i stedet for å legge til en enkel verdi, tilordner du en hel funksjon til et navn.

For eksempel har den neste versjonen av critter en changeSpeed ​​() -metode. Når brukeren trykker på pil opp, vil critter øke hastigheten, og når brukeren trykker på nedpilen, vil critter bremse ned (og til slutt gå i den andre retningen). Her er koden for critter med sin nye metode på plass:

critterChangeSpeed. html var spill; var critter; funksjon Critter () {tCritter = ny Sprite (spill, "critter.gif", 30, 30); tCritter. hastighet = 0; tCritter. checkKeys = function () { hvis (keysDown [K_RIGHT]) { dette. hastighet ++; } hvis (keysDown [K_LEFT]) { dette. hastighet--; } tCritter. setSpeed ​​(denne hastigheten); } // ende metode return tCritter;} funksjon init () {game = new Scene (); critter = ny Critter (); spill. start ();} funksjon oppdatering () {spill. klar(); critter. checkKeys (); critter. oppdatering ();}

Merk at den beveger seg når brukeren trykker på tastene. For dette og de fleste eksempler, vil et statisk bilde ikke være nok til å hjelpe deg med å se hva som skjer.

I denne nye versjonen av programmet har Critter-objektet en ny oppførsel identifisert. I hovedsak er en metode ikke noe mer enn en funksjon definert i en klasse. Ikke bli panikk. Det er egentlig ikke så vanskelig å finne ut. Du forteller systemet hva du skal gjøre hvis brukeren noensinne spør Critter-objektet om å endre hastighet.

1. Opprett en ny eiendom kalt checkKeys.

   I JavaScript er en eiendom og en metode akkurat det samme. Hvis du knytter en vanlig variabel til et objekt, er det en egenskap. Hvis du knytter en funksjon til den, er det en metode. (Eiendomsnavn er normalt substantiv. Metodenavn er normalt verb eller verbsetning.)

2. Bygg en ny metode for å inneholde oppførselen.

   changeSpeed ​​er ikke en vanlig eiendom, men en metode, slik at du knytter en funksjon til den. (For Computer Science-majors der ute, bygger en anonym funksjon på fly som dette er et eksempel på en lambda -funksjon. Se etter det på midtveiseksamen!)

3. Kontroller tastaturinngang.

   Når du lager et Critter-objekt, vet du allerede hvordan du skal søke etter egne tastetrykk.

4. Endre hastigheten basert på tastaturinngang.

   Hvis brukeren trykker til høyre, øker hastigheten (i standard retning beveger positive hastigheter sprite til høyre).Hvis brukeren trykker til venstre, senker du hastigheten.

5. Bruk metoden setSpeed ​​() for å endre den faktiske hastigheten.

   Sprite-objektet som gir utskrift for critter, har allerede en setSpeed ​​() -metode. Bruk denne metoden for å få objektet til å bevege seg ved angitt hastighet.

6. Bruk dette søkeordet inne i en metode.

   Når du lager en metode inne i en konstruktør, kan datamaskinen bli litt forvirret om navnene på ting. For det meste legger du ting til en midlertidig critter kalt tCritter. For å eliminere forvirring, hvis du trenger å referere til andre egenskaper eller metoder for objektet du modifiserer, bruk det generelle søkeordet dette i stedet for det faktiske navnet på objektet.

7. Endre oppdateringen () -funksjonen, slik at critter kontrollerer tastaturet.

   Husk at hovedoppdateringen () -funksjonen skjer en gang per ramme. Alt du vil skje en gang per ramme, skal kalles i oppdatering (). Legg til et anrop til critter. checkKeys (). Dette vil minne på critter å kontrollere tastaturet hver ramme og endre hastigheten etter behov.