Sätta brytpunkter
Pausa körningen och granska tillståndet.
Sätta brytpunkter är en gratis lektion i JavaScript Academy på CoddyKit. Detta är lektion 2 av 4. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för JavaScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i JavaScript Academy innehåller totalt 4 lektioner.
Vad är en brytpunkt
En brytpunkt talar om för debuggern att pausa körningen på en viss rad. När körningen är pausad kan ni granska variabler och anropsstacken för att förstå programmets tillstånd.
Varför brytpunkter är bättre än loggning
Jämfört med att sprida ut loggutskrifter låter brytpunkter er granska alla variabler i det aktuella scopet utan att ändra koden. Därefter kan ni fortsätta eller stega vidare.
Öppna Sources-panelen
I webbläsarens DevTools finns brytpunkterna i Sources-panelen. Öppna DevTools, byt till Sources och leta upp skriptfilen i filträdet.
Ange en radbrytpunkt
Klicka i marginalen bredvid radnumret för en sats för att ange en brytpunkt där. En markering visas, och körningen pausas precis innan raden ska köras.
Satsen debugger
Om ni lägger till satsen debugger i koden utlöses en brytpunkt programmatiskt när DevTools är öppet. Ta bort den innan produktionskod levereras.
function compute(x) {
const doubled = x * 2
// a debugger statement on the next line would pause execution here
return doubled + 1
}Villkorliga brytpunkter
Genom att högerklicka på en rad kan ni lägga till ett villkor. Debuggern pausar endast när uttrycket är sant, vilket är mycket värdefullt i loopar.
Loggpunkter
En loggpunkt skriver ut ett meddelande utan att pausa, ungefär som en tillfällig loggutskrift som läggs till via DevTools i stället för genom att källkoden redigeras.
Granska variabler
När körningen är pausad visar Scope-panelen lokala variabler, closure-variabler och globala variabler med sina aktuella värden, så att ni kan kontrollera era antaganden.
Watch-uttryck
Watch-panelen utvärderar de uttryck ni definierar vid varje paus, så att ni kan följa ett beräknat värde medan ni stegar genom koden.
Brytpunkter vid händelser
DevTools kan även pausa vid händelser, till exempel ett klick eller en nätverksbegäran, så att körningen stoppas i samma ögonblick som händelsen inträffar.
Hantera brytpunkter
Breakpoints-panelen listar alla era brytpunkter. Ni kan tillfälligt inaktivera dem med en kryssruta eller ta bort dem när felsökningen är klar.
Snabbtest
Testa era kunskaper om brytpunkter.
Sammanfattning
Sammanfattning: Brytpunkter pausar körningen så att koden kan granskas.
- Ange dem i marginalen i Sources-panelen
- Satsen debugger pausar programmatiskt
- Villkorliga brytpunkter pausar endast när villkoret är sant
- Granska scope och Watch-uttryck medan körningen är pausad
Lär dig JavaScript med en AI-lärare – gratis
Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.
- Kurser
- 59
- Lektioner
- 200
Vanliga frågor
Är lektionen ”Sätta brytpunkter” gratis?
Ja – du kan läsa vilka 3 lektioner som helst i lärvägen JavaScript Academy, inklusive ”Sätta brytpunkter”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i JavaScript Academy innehåller totalt 4 lektioner.
Vad lär jag mig i ”Sätta brytpunkter”?
Pausa körningen och granska tillståndet. Ni övar på JavaScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.
Behöver jag någon erfarenhet för att börja lära mig JavaScript Academy?
Du behöver inga förkunskaper. Utbildningen i JavaScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 2 av 4.
Hur lång tid tar lektionen ”Sätta brytpunkter”?
De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.
Kan jag skriva och köra kod i den här JavaScript Academy-lektionen?
Ja. Varje JavaScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.
Alla lektioner i den här kursen
- Bortom console.log
- Sätta brytpunkter
- Stega igenom kod
- Läsa stackspårningar