Spring til indhold
Academi.dk

JavaScript

Objekter

Let øvet DA↔EN-ordliste 1 øvelse

Et objekt samler flere værdier under navne i stedet for numre. Du skriver dem i krølleparenteser som nøgle og værdi, og du henter en værdi frem med punktum og nøglens navn. Objekter er den måde, du beskriver en ting med flere egenskaber.

Forudsætter, at du har set arrays .

Når nummer ikke er nok

Et array er fint til en liste af ens ting. Men skal du beskrive én ting med flere forskellige egenskaber, en studerende med navn, alder og studieretning, er numre ubrugelige. Du vil have navne på felterne.

Eksempel
const studerende = {
navn: "Ida",
alder: 21,
linje: "HA(it.)"
};

console.log(studerende.navn);
console.log(studerende.alder);

Output

Tryk på “Kør koden”.

Krølleparenteser omkring, nøgle: værdi med komma imellem, og punktum til at hente værdien frem. Det er hele grundformen.

At læse, skrive og tilføje

Eksempel
const bog = { titel: "Eloquent JavaScript", sider: 472 };

bog.sider = 480;
bog.sprog = "engelsk";

console.log(bog);
console.log(bog.forfatter);

Output

Tryk på “Kør koden”.

Du kan skrive over en eksisterende nøgle og tilføje en ny på præcis samme måde. Beder du om en nøgle, der ikke findes, får du undefined, ikke en fejl. Det er den samme opførsel som med arrays, og den er lige så drilsk.

Du kan også bruge kantede parenteser, og det skal du, når nøglens navn ligger i en variabel:

Eksempel
const bog = { titel: "Eloquent JavaScript", sider: 472 };
const felt = "titel";

console.log(bog["titel"]);
console.log(bog[felt]);

Output

Tryk på “Kør koden”.

Objekter inde i objekter

Data fra virkeligheden er sjældent fladt. Et objekt kan indeholde både arrays og andre objekter, og du graver dig ned med flere punktummer.

Eksempel
const kursus = {
navn: "Programudvikling 1",
ects: 15,
underviser: { navn: "Hansen", email: "[email protected]" },
emner: ["variabler", "løkker", "funktioner"]
};

console.log(kursus.underviser.navn);
console.log(kursus.emner[1]);
console.log(kursus.emner.length);

Output

Tryk på “Kør koden”.

Lister af objekter

Den kombination møder du overalt, især når data kommer fra et API: et array, hvor hvert element er et objekt med de samme felter. Det svarer nøjagtig til en tabel i en database, hvor hver række har de samme kolonner.

Eksempel
const hold = [
{ navn: "Ida", karakter: 10 },
{ navn: "Omar", karakter: 7 },
{ navn: "Sofie", karakter: 12 }
];

const bedste = hold.filter((s) => s.karakter >= 10);

for (const person of bedste) {
console.log(person.navn);
}

Output

Tryk på “Kør koden”.

Funktioner inde i objekter

En værdi må gerne være en funktion. Så hedder den en metode, og den kan bruge objektets egne felter med this.

Eksempel
const konto = {
ejer: "Ida",
saldo: 1000,
indsaet(beloeb) {
  this.saldo = this.saldo + beloeb;
  return this.saldo;
}
};

console.log(konto.indsaet(500));
console.log(konto.saldo);

Output

Tryk på “Kør koden”.

Det er direkte forløberen for klasser og objekter i andet semester. Et objekt, der både har data og de funktioner, der hører til dataene, er hele idéen i objektorienteret programmering.

Kort opsamling

  • Objekter har navngivne felter, arrays har nummererede pladser.
  • Hent med objekt.felt eller objekt["felt"].
  • En nøgle, der ikke findes, giver undefined.
  • Array af objekter er den mest almindelige datastruktur, du møder.

Øv dig

Læs videre

Senest gennemgået .