JavaScript — ex2-11

2.11 Array, lista

En array är ett objekt som består av en lista med flera värden. Man sparar en array i en variabel och kan komma åt de olika värdena genom ett index, som börjar på 0 för första värdet, 1 för andra värdet, etc. En array har några egenskaper, bl.a. length som är antalet värden i listan, och flera metoder (funktioner), för att ta fram data eller förändra arrayen. Detta exempel har två delar:

De olika egenskaperna och metoderna illustreras med små exempel.
Omskrivning av exemplet med bildspelet, där filnamnen nu sparas i en array.

18 min.

Sammanfattning

Man skapar en array med två hakparenteser, []. Antingen skapar man en tom array eller så kan man direkt lägga in en kommaseparerad lista av värden mellan hakparenteserna. Man kan också använda new Array(), men vi använder det kortare skrivsättet [] i denna exempelsamling.

För att komma åt de olika positionerna i arrayen anger man variabelns namn och ett index inom hakparenteser, t.ex. a[2]. Index för första positionen är 0.

Man kan både avläsa ett värde, t.ex. x = a[2] och spara ett nytt värde, t.ex. a[2] = y.

Om vi tänker oss att a = ["äpple", "päron", "banan", "apelsin"] i varje rad nedan, får vi följande:

Egenskap / metod	Returnerat resultat	Förändring av a
`a.length`	`4`	oförändrad
`a.push("citron")`	inget returvärde	`["äpple","päron","banan","apelsin","citron"]`
`a.pop()`	`"apelsin"`	`["äpple","päron","banan"]`
`a.sort()`	inget returvärde	`["apelsin","banan","päron","äpple"]`
`a.slice(1,2)`	`["päron","banan"]`	oförändrad
`a.slice(1)`	`["päron","banan","apelsin"]`	oförändrad
`a.splice(2,1)`	`["banan"]`	`["äpple","päron","apelsin"]`
`a.includes("banan")`	`true`	oförändrad
`a.includes("kiwi")`	`false`	oförändrad
`a.indexOf("banan")`	`2`	oförändrad
`a.indexOf("kiwi")`	`-1`	oförändrad
`a.join("/")`	`"äpple/päron/banan/apelsin"`	oförändrad

Några vanliga egenskaper och metoder introducerades i detta exempel och en del andra återkommer vi till i senare exempel. Se även referenslistan för fler exempel och beskrivning.

Egna övningar

Här följer ett förslag på några egna övningar. Öppna filen test.html och test.js och utför följande:

Skapa en variabel kallad towns, med en array som innehåller namn på fem städer.
Skriv en for-loop som går igenom alla värden (dvs städer) i towns. I loopen ska du skriva ut det värde som indexeras av loopvariabeln. Lägg även till taggar för ett p-element i utskriften, så att varje stad hamnar på varsin rad.
Skapa en variabel r och tilldela den ett slumptal mellan 0 och index för det sista värdet i arrayen. Spara den stad som indexeras av r i den globala variabeln randomTown. Skriv också ut randomTown i elementet för resultat.