Spring til indhold
Academi.dk

Fejlbeskeder

Cannot read properties of undefined

Let øvet DA↔EN-ordliste

Fejlen betyder, at du forsøger at hente noget ud af en værdi, der ikke findes. Det, der står lige til venstre for det sidste punktum, er undefined. Fejlteksten fortæller i parentesen, hvilket felt du forsøgte at læse, og det er nøglen til at finde årsagen.

Forudsætter, at du har set objekter .

Hvad beskeden siger

TypeError: Cannot read properties of undefined (reading 'navn')

Oversat: “jeg skulle hente feltet navn, men det, jeg skulle hente det fra, findes ikke”.

Læg mærke til, hvad fejlen ikke siger. Den siger ikke, at navn er undefined. Den siger, at det, der står foran navn, er undefined.

Eksempel 
const kursus = { navn: "Programudvikling 1" };

console.log(kursus.navn);
console.log(kursus.underviser.navn);

Output

Tryk på “Kør koden”.

kursus.underviser findes ikke, altså er den undefined, og så kan man ikke hente navn ud af den.

De fire almindelige årsager

1. Et array-element, der ikke findes. Løkken løber én for langt:

Eksempel 
const navne = ["Ida", "Omar"];

for (let i = 0; i <= navne.length; i++) {
console.log(navne[i].length);
}

Output

Tryk på “Kør koden”.

Ret <= til <. Se for-løkken.

2. querySelector fandt ikke elementet. Så får du faktisk null og beskeden Cannot read properties of null. Samme sag. Tjek selektoren, og tjek at scriptet kører efter, elementet findes.

3. Data fra et API ser anderledes ud, end du tror. Du skriver data.resultater[0].navn, men svaret hedder data.results. Skriv altid hele svaret ud med console.log(data), før du graver i det.

4. En funktion returnerede ingenting. En glemt return giver undefined, og det næste punktum fejler så. Se funktioner.

Sådan finder du den på et minut

  1. Læs, hvad der står i parentesen. Det felt, du forsøgte at læse.
  2. Find linjen i fejlbeskeden.
  3. Skriv den del ud, der står til venstre for det sidste punktum:
Eksempel 
const data = { bruger: { navn: "Ida" } };

console.log(data);
console.log(data.konto);

Output

Tryk på “Kør koden”.

Er den undefined, ved du nu præcis, hvor kæden knækker, og så kan du gå baglæns derfra.

Sådan undgår du den

Tjek før du bruger:

Eksempel 
const kursus = { navn: "Programudvikling 1" };

if (kursus.underviser) {
console.log(kursus.underviser.navn);
} else {
console.log("Ingen underviser registreret");
}

Output

Tryk på “Kør koden”.

Eller kortere, med et spørgsmålstegn efter det, der måske ikke findes:

Eksempel 
const kursus = { navn: "Programudvikling 1" };

console.log(kursus.underviser?.navn);
console.log(kursus.underviser?.navn ?? "Ukendt");

Output

Tryk på “Kør koden”.

?. betyder “hvis den findes, så hent videre. Ellers giv undefined uden at kaste en fejl”. ?? betyder “brug det til venstre, medmindre det er undefined eller null”.

Kort opsamling

  • Det, der er undefined, står til venstre for det sidste punktum.
  • Parentesen i beskeden fortæller, hvilket felt du forsøgte at læse.
  • Skriv venstresiden ud og gå baglæns.
  • ?. og ?? er til felter, der reelt kan mangle.

Læs videre

Senest gennemgået .