Fejlfinding

Fejlbeskeden er ikke en straf#

Den er den bedste information, du får. Læs den i tre dele:

Uncaught TypeError: Cannot read properties of undefined (reading 'navn')
    at visNavn (script.js:12)

• Typen (TypeError) siger, hvilken slags problem det er.
• Teksten siger, hvad der konkret gik galt.
• Linjen (script.js:12) siger hvor, og navnet foran er den funktion, det skete i.

De tre typer, du møder mest:

Skriv værdier ud i stedet for at stirre#

Den hurtigste vej til at finde en fejl er at holde op med at gætte, hvad variablerne indeholder, og få det at vide.

function beregnGennemsnit(karakterer) {
let sum = 0;
for (let i = 0; i <= karakterer.length; i++) {
  sum = sum + karakterer[i];
}
return sum / karakterer.length;
}

console.log(beregnGennemsnit([10, 7, 4]));

Tryk på “Kør koden”.

Den giver NaN. Sæt en console.log(i, karakterer[i], sum); ind i løkken, kør igen, og se, hvor det går galt. Du kan rette i koden direkte i feltet.

Fejlen er <= i stedet for <. Sidste gennemløb beder om en plads, der ikke findes, får undefined, og sum + undefined bliver NaN.

En fremgangsmåde, der virker hver gang#

1. Læs beskeden. Hele beskeden. Også linjenummeret.
2. Gå til linjen og se, hvad der står lige før fejlen.
3. Skriv de involverede værdier ud med console.log. Ikke bare den ene.
4. Halvér problemet. Virker første halvdel af funktionen? Så ligger fejlen i anden. Bliv ved med at halvere.
5. Ret én ting ad gangen og kør igen. Retter du tre ting, ved du ikke, hvad der virkede.

Tricks, der sparer tid#

const bruger = { navn: "Ida", alder: 21 };

console.log(bruger);
console.log({ bruger });
console.log(typeof bruger.alder);
console.table([{ navn: "Ida" }, { navn: "Omar" }]);

Tryk på “Kør koden”.

• console.log({ x }) skriver både navnet og værdien, så du kan se, hvilken variabel du kigger på.
• typeof afslører den klassiske fejl, hvor et tal i virkeligheden er tekst.
• console.table er guld, når du har et array af objekter.

Når du er kørt fast#

Sig problemet højt, som om du forklarede det for en anden: “funktionen skulle give et tal, men den giver undefined, og det sker kun når listen er tom”. Halvdelen af alle fejl bliver fundet midt i den sætning. Kan du ikke formulere den, ved du i det mindste præcis, hvad du skal spørge om.

Kort opsamling#

• Type, tekst og linje. Læs alle tre.
• console.log de faktiske værdier frem for at gætte.
• Halvér problemet, indtil det er lille.
• Ret én ting ad gangen.