Hvordan bruke Arrays å forenkle data i HTML5 spill

HTML5-spill er om data; ofte det betyr mye data. En rekke er de mest grunnleggende verktøy programmerere har for å håndtere store mengder data. Java støtter en enkel, men svært kraftig og fleksibel mekanisme som lar deg gjøre mye med arrays.

En matrise er faktisk en veldig enkel idé; det er rett og slett en liste. Du har allerede brukt lister mange ganger i HTML-koding, men i programmering, blir listene kalles arrays, og har spesielle egenskaper. Dette eksempelet har to arrays - en liste over bøker som er skrevet av en viss sjarmerende og djevelsk kjekk forfatter, og noen av temaene sa forfatteren skriver om.

Denne siden har fire hovedkomponenter:

• HTML struktur: Den har en form med to knapper. Kroppen kaller en initialisering funksjon når den lastes ned, og hver knapp kaller sin egen funksjon. Siden har også en div heter utgang.
• En init () -funksjonen: Denne funksjonen gir tilgang til utgangs div, og det også laster opp de to matriser som er beskrevet i dette eksempel. Arrays vanligvis kreve noen form for initialisering.
• De showBooks () funksjon: Du vil bli overrasket og overrasket over at denne funksjonen viser en rekke boktitler.
• Den showTitles () funksjon: Denne funksjonen viser en annen måte å gå gjennom elementene i en matrise.

Hvordan bygge spillets arrays

Arrays er ofte laget som globale variabler fordi de er ofte brukt gjennom hele programmet (og i noen språk, passerer en matrise som et parameter kan være slags komplisert).

I dette programmet kan du lage en rekke variabler i den globale plass og initial dem alle i init () funksjon kalt med body.onload.

Var utgang;
Var bøker;
Var emner;
funksjon init () {
// Initial utgang og matriser
// Fra basicArrays.html
output = document.getElementById ("output");
bøker = Array ("Flash Game Programming for Dummies",
"Spillprogrammering, L Line",
"HTML / XHTML / CSS Alt i ett",
"Javascript og AJAX for Dummies",
"HTML5 Quick Reference");
emner = Array (5);
emner [0] = "HTML5";
emner [1] = "CSS3";
emner [2] = "Javascript";
emner [4] = "AJAX";
} // End init

Sette opp arrays er den viktigste delen av prosessen:

1. Opprette variabler for arrays.

   Det er to arrays i dette eksempelet, bøker og emner. Hver er skapt akkurat som alle andre variable, med VAR-uttalelse. Man også lage en utgangsvariabel for å holde en referanse til utgangs div.

2. Bygg en init () -funksjonen til å initialisere variabler.

   Som programmer blir mer komplekse, er det vanlig å ha en initialisering funksjon for å sette alt opp. Denne funksjonen kalles med body.onload.

3. Bygg utgangs variable.

   Fordi alle de andre funksjonene vil bruke utgang, oppretter du den i init ().

4. Bruk Array () -funksjonen til å opprette rekke bøker.

   Denne spesialfunksjon blir brukt til å lage en rekke elementer. Legg merke til at den bruker en stor bokstav A. (Hvis du må være teknisk, er dette en konstruktør for en Array objekt, men i Javascript, som er en funksjon, også.)

5. Bare liste hver bok som et parameter i Array () -funksjonen.

   Hvis man mate Array funksjonen en serie av verdier, blir de verdier av matrisen. Denne teknikken er flott hvis du allerede vet hva som vil gå inn i hvert element når du bygger matrisen.

6. Bygge emner rekke annerledes.

   Den emner matrise er å bygge med en annen teknikk. I denne tabellen, kan du angi et enkelt heltall, som er antall elementer i matrisen vil inneholde.

7. Bruk indeksen operatøren å legge til elementer i matrisen.

   Alle array elementer har samme navn, men de har et forskjellig antall. Bruke firkantparenteser med et helt tall for å henvise til et bestemt element i gruppen. Merk at array elementer alltid begynne med element null.

Hvis du har brukt matriser i andre programmeringsspråk, vil du finne Javascript arrays for å være veldig tilgivende. Vær forsiktig, skjønt, fordi arrays er en av de funksjonene som alle språk støtter, men de virker litt annerledes. Du vil faktisk finne Javascript-arrays er mer som Arraylist i Java eller Vector klasse i C ++ enn den tradisjonelle array i ett av disse språkene.

Den bøker array å forberede spillene dine

Arrays er fantastisk fordi de tillater deg å pakke mye av data til en enkelt variabel. Veldig ofte når du har en matrise, vil du ønsker å gjøre noe med hvert element i matrisen. Den vanligste struktur for å gjøre dette er en for løkke. Se på showBooks () for et eksempel:

funksjons showBooks () {
// Fra basicArrays.html
output.innerHTML = "";
for (i = 0; i <books.length; i ++) {
output.innerHTML + = bøker [i] + "<br />";
} // Slutt for loop
} // end showBooks

Denne funksjonen trinn gjennom listen av bøker og skriver navnet til hver og en i utgangsområdet:

1. Tømme utgang div.

   Produksjonen har allerede blitt definert i init () -funksjonen, så det er ganske lett å tømme ut sin verdi i funksjonen.

2. Bygge opp en løkke for lengden av rekken.

   Arrays og etter looper er naturlige samarbeidspartnere. I denne sløyfen, har du jeg telle fra null til antall elementer i tabellen.

3. Begynn med null.

   Array indekser alltid begynne med null, slik at tellevariabelen bør også starte på null (i de fleste tilfeller).

4. Bruk lengde eiendom for å avgjøre hvor lenge matrisen er.

   Når du bygger en for løkke til å gå gjennom en matrise, hva du egentlig vil vite er hvor mange elementer er i rekken. Bruk arrayName.length å bestemme antall elementer i dagens array, hvor arrayName er navnet på den aktuelle array. På denne måten, selv om antallet av elementer i matrisen endres, virker sløyfen fremdeles fullstendig.

5. Prosessdata inne i løkken.

   Hvis tellevariabelen er i, er hvert element i matrisen arrayName [i] innenfor sløyfen. Du kan gjøre hva du vil med dataene.