Lister (Arrays)

Hva er en liste?

I virkeligheten bruker vi lister hele tiden: handlelister, elevlister, spillelister. I JavaScript heter lister arrays, og de lar deg lagre flere verdier i én variabel.

Uten en liste måtte du gjort dette:

let frukt1 = "eple";
let frukt2 = "banan";
let frukt3 = "appelsin";

Med en liste:

let frukt = ["eple", "banan", "appelsin"];

Mye enklere - spesielt når du har mange verdier!

Lage en array

let farger = ["rød", "grønn", "blå"];
let tall = [1, 2, 3, 4, 5];
let blandet = ["tekst", 42, true];  // Kan blande typer
let tom = [];                        // Tom array

Hente verdier

Hvert element i en array har en indeks (posisjon). Indekser starter på 0, ikke 1:

let farger = ["rød", "grønn", "blå"];
                 0       1       2

let farger = ["rød", "grønn", "blå"];

farger[0]    // "rød"    (første element)
farger[1]    // "grønn"  (andre element)
farger[2]    // "blå"    (tredje element)

Indeks starter på 0

Det første elementet er [0], ikke [1]. Dette er en veldig vanlig feilkilde!

Endre verdier

let farger = ["rød", "grønn", "blå"];

farger[1] = "gul";
// farger er nå ["rød", "gul", "blå"]

Nyttige egenskaper og metoder

Antall elementer

let farger = ["rød", "grønn", "blå"];
farger.length    // 3

Legge til og fjerne

let frukt = ["eple", "banan"];

// Legge til på slutten
frukt.push("appelsin");
// ["eple", "banan", "appelsin"]

// Fjerne siste element
frukt.pop();
// ["eple", "banan"]

// Sjekke om noe finnes
frukt.includes("eple");    // true
frukt.includes("mango");   // false

Gå gjennom en array

Bruk for...of for å gå gjennom alle elementene:

let farger = ["rød", "grønn", "blå"];

for (let farge of farger) {
    console.log(farge);
}
// "rød"
// "grønn"
// "blå"

Eller med forEach:

let farger = ["rød", "grønn", "blå"];

farger.forEach(function(farge) {
    console.log(farge);
});

Flere array-metoder

let tall = [1, 2, 3, 4, 5];

// forEach - gjør noe med hvert element
tall.forEach(n => console.log(n));

// map - lag ny array med endrede verdier
let doblet = tall.map(n => n * 2);  // [2, 4, 6, 8, 10]

// filter - lag ny array med elementer som matcher
let store = tall.filter(n => n > 2);  // [3, 4, 5]

Se JavaScript-referansen for en komplett oversikt over array-metoder som map, filter, find og reduce.

Eksempel: Handleliste

let handleliste = [];

// Legge til varer
handleliste.push("melk");
handleliste.push("brød");
handleliste.push("ost");

// Skrive ut listen
console.log("Handleliste:");
for (let vare of handleliste) {
    console.log("- " + vare);
}
// Handleliste:
// - melk
// - brød
// - ost

// Fjerne siste vare
handleliste.pop();
console.log("Antall varer:", handleliste.length);  // 2