Arrays

Fra Holstebro HTX Wiki
Skift til: navigering, søgning

Hvad er et "Array"?

Et array er en special variable, som indeholder mere end en variable af gangen.

Hvis du nu har en liste af forskellige ting (for eksempel forskellige mobilselskaber), og du nu ville smile dem i en "nem" variabel, kunne det gøres på følgende måde:

var mobilselskab1="Onfone"; 
var mobilselskab2="TDC"; 
var mobilselskab3="3-Mobile";
var mobilselskab4="Sonofon";
var mobilselskab5="Telenor";

Men hvad nu hvis, at du skulle sætte et loop for at finde én af disse 5 mobilselskaber, uden at du skulle til at lede? Og i det tilfælde, hvad nu hvis der var 500 mobilselskaber, hvor du nu igen skulle finde en bestemt? Den bedste løsning på dette problem ville være at bruge: Et Array!

En array kan indeholde alle disse forskellige variabler under et specifikt navn, og du kan få fat i alle disse variable navne (ovenover har jeg brugt mobilselskaber som disse navne) ved at bare taste dit Array navn!

Hver et element i din array har et specielt ID-nummer, som gør det nemt for dig at finde den variabel, som du leder efter!

Hvordan laver jeg mit eget Array?

Et Array kan laves på 3 forskellige måder.

Her er de 3 forskellige måder, hvori jeg igen har brugt "MobilSelskaber" som mit object.

1:

var MobilSelskaber=new Array(); 
MobilSelskaber[0]="Onfone";     
MobilSelskaber[1]="TDC";        
MobilSelskaber[2]="3-Mobile";   
MobilSelskaber[3]="Sonofon";
MobilSelskaber[4]="Telenor";
// et normalt Array (så den her måde bliver det nemmest 
// at definere hver ting med et specifikt nummer, som i 
// sidste ende kun kommer til at hjælpe dig selv, når du koder!)

2:

var myCars=new Array("Onfone","TDC","3-Mobile","Sonofon",Telenor"); 
// et fortættet Array, hvilket stadigvæk er et array,
// men den giver bare hvert tal et bestemt nummer i 
// rækkefølgen fra [0], så du kan ikke definere dem
// specifikt til at være noget bestemt, hvilket man
// kan i den første. 

3:

var myCars=["Saab","Volvo","BMW"]; 
// det mest simple Array; dette vil ikke være den bedste løsning, 
// pga. det samme, som jeg skrev til det andet eksempel,
// men det er den simpleste Array, man kan lave.  

Hvordan bruger jeg så mit Array?

Når du skal bruge dit array, efter du har defineret den tidligere, så skal du bare referere til navnet og det index-nummer, som vi nu har givet. Hvis i kigger på eksempel 1 i den forrige opgave, så kan i se, hvor jeg får mit navn og index-nummer fra.

Det vil sige, at hvis i skriver den her linje:

document.write(MobilSelskaber[0]);

Så vil din kode skrive:

Onfone

Hvordan ændrer jeg tal i mit nuværende Array?

For at lave om på et tal i en allerede eksisterende Array, så skal du bare give dit array med et specifikt nummer et nyt tal, hvilket kan blive gjort sådan her.

1: Vi bruger eksempel 1 igen fra den tidligere opgave.

var MobilSelskaber=new Array(); 
MobilSelskaber[0]="Onfone";     

2: Nu giver vi så vores "MobilSelskaber[0]" et nyt selskab. OBS: Dette skal skrives nedenunder den anden linje, da når man starter den kode, som man har skrevet, så læser den oppe fra og ned, så hvis man skriver det fra dette punkt først, så vil det senere blive erstattet af vores eksempel 1 fra "Hvordan laver jeg mit eget Array?"

MobilSelskaber[0]="TDC";

3: Så vil følgende linje,

document.write(MobilSelskaber[0]);

4: skrive dette i vores færdige program.

TDC

Egenskaber for Arrays

Den eneste væsentlige egenskab for Arrays er length, der angiver hvor mange elementer der er i arrayet.

Der findes også to grundlæggende egenskaber der kan ses på w3shools.com[1]

var test = new Array("Hej", "Med", "Dig", 37);

document.write(test.length);    // Viser resultatet 4

Metoder til Arrays

Man kan komme langt med at trække elementer ud af arrays, og lægge elementer ind igen, eller tilføjer ved at skrive elementer ind på pladser der ikke er indekseret endnu. Dette illustreres her:

var test = new Array(2, 4, 8);

alert(test[0]); // viser 2
alert(test[1]); // viser 4
test[1] = 7;
alert(test[1]); // viser 7
test[3] = 16;
alert(test.toString()); // viser 2,7,8,16

Ud over den type manipulation findes der en række indbyggede metoder, der kan lave mere eller mindre avancerede ting med arrayene. Disse metoder er illustreret herunder.

push og pop

Metoden push(element) føjer et element til arrayet efter det sidste element i arrayet, uanset hvor langt arrayet er.

var test = new Array(2, 4, 8);

alert(test.toString()); // viser 2,4,8
alert(test.push(16));   // viser 4 - det nye antal i arrayet
alert(test.toString()); // viser 2,4,8,16

Metoden push() er illustreret i filen array_push.html i ZIP-filen.

Metoden pop() trækker et element ud af arrayet fra sidste plads i arrayet.

var test = new Array(2, 4, 8);

alert(test.toString()); // viser 2,4,8
alert(test.pop());      // viser 8
alert(test.toString()); // viser 2,4

Metoden pop() er illustreret i filen array_pop.html i ZIP-filen.

shift og unshift

Metoderne shift() og unshift(element) virker på samme måde som pop() og push(element), bare på den anden ende af arrayet.

Metoden shift() fjerner det første element i arrayet

var test = new Array(2, 4, 8);

alert(test.toString()); // viser 2,4,8
alert(test.shift());    // viser 2
alert(test.toString()); // viser 4,8

Metoden shift() er illustreret i filen array_shift.html i ZIP-filen.

Metoden unshift(element) skubber et element ind på første plads i arrayet og returnerer det nye antal i arrayet

var test = new Array(2, 4, 8);

alert(test.toString()); // viser 2,4,8
alert(test.unshift(1)); // viser 4 - det nye antal i arrayet
alert(test.toString()); // viser 1,2,4,8

Metoden unshift() er illustreret i filen array_shift.html i ZIP-filen.

toString, valueOf og join

De tre metoder toString(), valueOf() og join() kan præcist det samme, nemlig at omdanne indholdet af et array til en tekst-streng. De to første har ikke yderligere egenskaber, andet end at valueOf er standard-metoden, hvis man viser arrayets værdi, uden at angive hvordan.

Metoden join() opfører sig igen lige sådan, at elementerne listes i en tekst-streng med komma imellem, men man kan også anvende join med en parameter, hvor det så er den tekst-streng man sender, der bliver skilletegn i stedet.

De 3 Metoder toString(), valueOf() og join() er illustreret i filen array_string.html i ZIP-filen.

sort og reverse

Metoden sort() sorterer det angivne array nede i arrayet - det er lidt specielt med tal, for de bliver tolket som tekst-strenge, og sorteret derefter, som det kan ses i følgende eksempel:

var test = new Array(32, 8, 2, 1, 4, 16);

alert(test.toString()); // viser 32,8,2,1,4,16
test.sort();
alert(test.toString()); // viser 1,16,2,32,4,8

Hvis man gerne vil have det sorteret som tal, så skal man lave en funktion, der udfører en sammenligning ved at trække tallene fra hinanden

var test = new Array(32, 8, 2, 1, 4, 16);

function sortNumber(a,b) {
   return a - b;
}

alert(test.toString()); // viser 32,8,2,1,4,16
test.sort(sortNumber);
alert(test.toString()); // viser 1,2,4,8,16,32

Metoden sort() er illustreret på begge måder i filen array_sort.html i ZIP-filen.

Metoden reverse() vender ganske enkelt arrayet om

var test = new Array(2, 4, 8);

alert(test.toString()); // viser 2,4,8
test.reverse();
alert(test.toString()); // viser 8,4,2

Metoden reverse() er illustreret i filen array_reverse.html i ZIP-filen.

concat, slice og splice

Metoderne concat(), slice() og splice() anvendes til at lave klippe-klistre på arrays, altså sætte dem sammen og klippe dem i stykker.

Metoden concat() samler flere arrays. Forskelligt fra mange af de andre metoder, så ændrer metoden ikke på det array den anvendes på, men giver i stedet det samlede array som resultat.

var test1 = new Array(2, 4, 8);
var test2 = new Array(1, 2, 3);

alert(test1.toString()); // viser 2,4,8
alert(test2.toString()); // viser 1,2,3
var test3 = test1.concat(test2);
alert(test3.toString()); // viser 2,4,8,1,2,3

Metoden concat() er illustreret i filen array_concat.html i ZIP-filen.

Metoden slice() anvendes til at klippe dele ud af arrays. Forskelligt fra mange af de andre metoder, så ændrer metoden ikke på det array den anvendes på, men giver i stedet det klippede array som resultat.

Metoden slice() kan anvendes på 4 forskellige måder:

Med 2 positive parametre klippes en del af et array ud, fra det første index til, men ikke med det andet (index de to parametre).

var test = new Array(32, 8, 2, 1, 4, 16);

var test2 = test.slice(2, 4);
alert(test.toString()); // viser 32,8,2,1,4,16
alert(test2.toString()); // viser 2,1

Med 1 positiv parameter klippes den første del af arrayet af. Resultatet er fra det angivne index til slutningen af arrayet.

var test = new Array(32, 8, 2, 1, 4, 16);

var test2 = test.slice(3);
alert(test.toString()); // viser 32,8,2,1,4,16
alert(test2.toString()); // viser 1,4,16

Med en negativ parameter klippes den sidste del af arrayet ud. Angiver man -3, så får man de sidste 3 elementer i arrayet (hvis der er 3 i arrayet).

var test = new Array(32, 8, 2, 1, 4, 16);

var test2 = test.slice(-2);
alert(test.toString()); // viser 32,8,2,1,4,16
alert(test2.toString()); // viser 4,16

Med først en positiv parameter og derefter en negativ parameter, så kan man klippe et bestemt antal af starten, og et bestemt antal af slutningen. Man angiver det første index man vil have med (det første element har index 0), og så angiver man antallet der skal klippes af slutningen, som et negativt tal

var test = new Array(32, 8, 2, 1, 4, 16);

var test2 = test.slice(1, -2);
alert(test.toString()); // viser 32,8,2,1,4,16
alert(test2.toString()); // viser 8,2,1

Metoden slice() er illustreret i filen array_slice.html i ZIP-filen.

Metoden splice() kan klippe en del af et array ud, og kan som en mulighed sætte nye elementer ind, der hvor der klippes ud. Det giver 3 muligheder:

At klippe et antal ud, og ikke andet:

var test = new Array(32, 8, 2, 1, 4, 16);

alert(test.toString()); // viser 32,8,2,1,4,16
var test2 = test.splice(1, 2);
alert(test.toString()); // viser 32,1,4,16
alert(test2.toString()); // viser 8,2


At klippe et antal ud, og sætte nogle andre elementer ind på det sted hvor der er klippet ud:

var test = new Array(32, 8, 2, 1, 4, 16);

alert(test.toString()); // viser 32,8,2,1,4,16
var test2 = test.splice(2, 3, 44, 45);
alert(test.toString()); // viser 32,8,44,45,16
alert(test2.toString()); // viser 2,1,4

At angive hvor der skal sættes ind (klippe 0 ud et sted), og sætte det ind:

var test = new Array(32, 8, 2, 1, 4, 16);

alert(test.toString()); // viser 32,8,2,1,4,16
var test2 = test.splice(4, 0, 17);
alert(test.toString()); // viser 32,8,2,1,17,4,16
alert(test2.toString()); // viser 8,2

Metoden splice() er illustreret i filen array_splice.html i ZIP-filen.

Eksempler

Her ligger en zip fil, som indeholder forskellige eksempler på hvordan og hvad man kan bruge arrays til.

Zip filen indeholder:

- Lav rækker ud fra array

- Læg to arrays i samme linje

- Læg tre arrays sammen

- Sæt array i alfabetisk orden

- Tilføg flere elementer til et array

- Udvælg en del fra et array

Media:Arrays.zip

Referencer