Hvorfor får jeg NaN?

NaN er en værdi, ikke en fejlbesked#

Der bliver ikke kastet en fejl. Programmet kører videre, og du opdager det først, når der står NaN på skærmen. Det er derfor, den er så irriterende: den siger ikke, hvor den kom fra.

NaN er teknisk set et tal, typeof NaN giver "number", men det er tallet, der betyder “det her regnestykke gav ikke mening”.

De fem årsager#

console.log(Number("tolv"));
console.log(undefined + 1);
console.log("5" * "abc");
console.log(0 / 0);
console.log(Math.sqrt(-1));

Tryk på “Kør koden”.

1. Tekst, der ikke er et tal, laves om til et tal. Number("tolv").
2. En værdi er undefined. Oftest et array-element eller et objektfelt, der ikke findes.
3. Der regnes på tekst. Bemærk, at "5" * 2 faktisk giver 10. JavaScript klarer det, hvis teksten ligner et tal. Det er kun, når den ikke gør, at det går galt.
4. 0 divideret med 0.
5. Kvadratrod af et negativt tal og lignende matematisk umuligheder.

I praksis er nummer 1 og 2 årsagen 95 procent af gangene.

Den typiske situation i din opgave#

const felter = ["12", "7", ""];
let total = 0;

for (let i = 0; i < felter.length; i++) {
total = total + Number(felter[i]);
}

console.log(total);

Tryk på “Kør koden”.

Her giver Number("") faktisk 0, så det går godt. Ret det tomme felt til "syv" og kør igen, så bliver hele totalen NaN. Det er smitten: så snart ét led er NaN, er summen det også.

Sådan finder du den skyldige#

Skriv de enkelte led ud, ikke resultatet:

const vaerdier = ["12", "syv", "3"];

for (const v of vaerdier) {
console.log(v, Number(v), Number.isNaN(Number(v)));
}

Tryk på “Kør koden”.

Number.isNaN(x) er den rigtige måde at teste. Brug den, ikke x === NaN, som altid er false, fordi NaN mærkeligt nok ikke er lig med sig selv.

Sådan undgår du det#

function tilTal(vaerdi, standard) {
const tal = Number(vaerdi);
return Number.isNaN(tal) ? standard : tal;
}

console.log(tilTal("12", 0));
console.log(tilTal("syv", 0));
console.log(tilTal("", 0));

Tryk på “Kør koden”.

En lille hjælpefunktion som den her, brugt hver gang noget kommer ind udefra - fra et felt, fra et API. Fjerner hele problemet. Valider ved kanten, og regn trygt derefter.

Kort opsamling#

• NaN opstår, når et regnestykke ikke giver mening.
• Næsten altid: tekst der ikke er et tal, eller en værdi der er undefined.
• NaN smitter til alt, den indgår i.
• Test med Number.isNaN, aldrig med ===.