Find frem til en fejl
Isolér problemet med hjælp fra AI.
Find frem til en fejl er en gratis Vibe-programmering-lektion på CoddyKit. Dette er lektion 3 af 4. Du kan læse alle 3 lektioner i dette læringsspor gratis i deres fulde længde — derefter låser CoddyKit PRO alle lektioner op samt praktiske øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Den er en del af læringsforløbet i Vibe-programmering, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. Vibe-programmering-kurset indeholder 4 lektioner i alt.
Når der ikke er en tydelig fejl
Nogle gange går intet ned — appen gør bare det forkerte. Knappen virker ikke, summen er forkert, eller dataene bliver aldrig vist. Der er ingen rød tekst at indsætte.
Det er her, rigtig fejlfinding begynder: at afgrænse, hvor problemet faktisk ligger. Den gode nyhed? AI er en utrolig god partner til dette — hvis du ved, hvordan du skal styre undersøgelsen.
Grundidéen: Del og hersk
En fejl gemmer sig et sted mellem dit input og dit output. Din opgave er at halvere søgeområdet igen og igen, indtil du har omringet den.
Tænk på det som at finde en defekt pære i en lyskæde: Du tjekker midten først. Er den første halvdel i orden? Så er afbrydelsen i den anden halvdel. Det er den mest effektive måde at tænke fejlfinding på.
Din bedste ven: console.log
Det enkleste værktøj til at indsnævre en fejl er at udskrive værdier forskellige steder. Kør dette — loggene viser dig præcis, hvad hver variabel indeholder undervejs.
Når den udskrevne værdi ikke er som forventet, har du fundet fejlens omtrentlige placering.
function getDiscountedPrice(price, percent) {
console.log("input price:", price);
console.log("input percent:", percent);
const discount = price * percent;
console.log("discount:", discount);
return price - discount;
}
console.log("final:", getDiscountedPrice(100, 20));Læs sporet
Se på det output, du lige så. Den endelige pris blev negativ! Loggene afslører hvorfor: percent var 20, men beregningen forventede 0.20. Loggen for discount viste 2000 — et tydeligt tegn.
Det er indsnævring i praksis: Loggene pegede på den præcise linje, hvor virkeligheden afveg fra din forventning. Du retter ikke i blinde — du lokaliserer først og retter derefter.
Bed AI om at tilføje logge
Du behøver ikke placere logge manuelt. Bed dit AI-værktøj om at instrumentere koden for dig. Det er en oplagt opgave for Cursor, Claude Code eller Copilot.
"This function returns the wrong total and I can't tell
why. Add console.log statements at each step so I can
see how the value changes. Don't change the logic yet —
just help me see what's happening."Kommentér ud for at isolere
Et andet trick til indsnævring er at deaktivere dele af koden midlertidigt. Hvis du har mistanke om en sektion, kan du kommentere den ud (eller returnere tidligt) og se, om problemet forsvinder.
Hvis fejlen forsvinder, findes den i den del, du fjernede. Hvis den bliver, skal du se et andet sted. Du gør høstakken mindre for hver test.
function renderPage() {
loadHeader();
// loadSidebar(); // <- commented out to test
loadContent();
}
// Bug gone? The problem was in loadSidebar().
// Bug still here? Look at loadHeader or loadContent.Kontrollér dine antagelser
De fleste genstridige fejl skyldes en forkert antagelse: »Jeg antog, at denne variabel indeholdt et tal, men den er faktisk tekst.« Indsnævring betyder, at du tester disse antagelser én ad gangen.
En god AI-prompt til dette er:
"Here's my function and what I expect each variable to
hold. Tell me which of my assumptions might be wrong,
and suggest one console.log I could add to confirm
the most likely one."Typeforvirring er snigende
En meget almindelig skjult fejl er, at en værdi er tekst, når du tror, den er et tal. Kør dette — resultatet ser mærkeligt ud, indtil du opdager, at "5" er en streng, så + sætter dem sammen i stedet for at lægge dem sammen.
Hvis du logger typen (ikke kun værdien), afsløres disse fejl med det samme.
const quantity = "5"; // came from a form input as text
const price = 10;
console.log("sum looks like:", quantity + price);
console.log("type of quantity:", typeof quantity);
console.log("fixed:", Number(quantity) + price);Indsnævr trinnene til at genskabe fejlen
Indsnævring handler ikke kun om kode — det handler også om handlinger. Find den mindste sekvens, der udløser fejlen.
Sker det hver gang eller kun med et tomt felt? Kun ved det andet klik? Kun med bestemte data? Hvert svar gør listen over mistænkte kortere. Giv AI disse resultater:
"I narrowed it down: the crash only happens when the
search box is EMPTY and I press Enter. With any text
it works fine. Given this, where should I look in
this handler function? [paste function]"Brug fejlfinderen til svære tilfælde
Ved mere vanskelige fejl kan browserens DevTools og editorer som Cursor lade dig sætte et stoppunkt — koden sættes på pause på en linje, så du kan undersøge alle variabler på det tidspunkt.
Du behøver ikke bruge det til alt; console.log klarer de fleste tilfælde. Men du bør vide, at det findes. Du kan endda spørge AI: »Hvor skal jeg sætte et stoppunkt for at fange dette?« Så peger den dig hen på den rigtige linje.
En arbejdsgang til indsnævring
Saml det i en gentagelig løkke:
- 1. Beskriv det forventede og det faktiske output
- 2. Log eller deaktivér et midtpunkt for at dele problemet i to
- 3. Kontrollér, hvilken halvdel fejlen er i
- 4. Gentag, indtil du har fundet den præcise linje
- 5. Giv AI den indsnævrede placering og dine resultater, så du får en præcis løsning
Så bliver »et eller andet sted i mine 500 linjer« til »denne ene linje, linje 42«.
Hurtigt tjek
Din app viser en forkert total, men viser ingen fejl. Hvad er det smarteste første skridt for at indsnævre problemet?
Opsummering: Du kan omringe enhver fejl
Du har lært at fejlfinde, selv når der ikke er en fejl, du kan indsætte. Din værktøjskasse indeholder nu:
- Del og hersk — halver søgeområdet gentagne gange
- console.log af værdier og typer for at se virkeligheden
- Kommentér sektioner ud for at isolere årsagen
- Test dine antagelser og minimér trinnene til at genskabe fejlen
- Lad AI tilføje logge, foreslå stoppunkter og bekræfte antagelser
Men hvad nu, hvis både du og AI sidder fast i en løkke? Det er den sidste lektion: når AI sidder fast.
Lær JavaScript med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 25
- Lektioner
- 100
Ofte stillede spørgsmål
Er lektionen “Find frem til en fejl” gratis?
Ja — alle 3 lektioner i læringssporet Vibe-programmering, inklusive “Find frem til en fejl”, kan læses gratis i deres fulde længde her på webstedet. Derefter låser CoddyKit PRO alle lektioner op samt interaktive øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Vibe-programmering-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Find frem til en fejl”?
Isolér problemet med hjælp fra AI. Du øver dig i Vibe-programmering med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på Vibe-programmering?
Der kræves ingen tidligere erfaring. Vibe-programmering på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 3 af 4.
Hvor lang tid tager lektionen “Find frem til en fejl”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne Vibe-programmering-lektion?
Ja. Alle Vibe-programmering-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Forstå fejlmeddelelser
- Indsæt fejl i AI på en effektiv måde
- Find frem til en fejl
- Når AI går i stå