Du vil skrive ut teksten "Hallo" til skjermen ti ganger. Med vanlig kode kopierer du samme linje ti ganger, og det fungerer, men det bryter DRY-prinsippet ("don't repeat yourself"). En while-løkke i JavaScript lar deg gjøre det samme med fire linjer, og gir deg full kontroll over hvor mange ganger koden kjøres.
Slik skriver du en while-løkke i JavaScript
En while-løkke består av tre deler: en tellervariabel, en logisk test, og en oppdatering av telleren inne i kodeblokken:
let i = 0;
while (i < 10) {
print("Hallo");
i++;
}
Først erklærer du variabelen i og setter den til 0. Deretter sjekker while-løkken om betingelsen i < 10 er sann. Er den det, kjøres kodeblokken: "Hallo" skrives ut, og i øker med 1. Deretter sjekkes betingelsen igjen. Slik fortsetter det helt til i når 10, og løkken stopper.
Tellervariabelen i: mer enn bare en teller
Variabelnavnet i er en konvensjon innen programmering. Den brukes så ofte i løkker at alle programmerere forstår hva den gjør, selv om vanlige variabler normalt skal ha beskrivende navn. Du kan selvfølgelig kalle den "index" eller noe annet, men i er standarden du vil møte i all JavaScript-dokumentasjon og andres kode.
Tellervariabelen kan brukes inne i selve løkken. Legger du i inn i utskriftskommandoen, får du en nummerert liste i stedet for bare "Hallo" ti ganger. Den kortere måten å skrive i = i + 1 på er i++, som legger til nøyaktig 1. Trenger du å øke med et annet tall, bruker du i += 3 eller en annen verdi.
Evighetsløkker: den vanligste feilen
Glemmer du å oppdatere tellervariabelen inne i kodeblokken, vil betingelsen alltid være sann. Da har du laget en evighetsløkke. Programmet kjører i det uendelige, og nettleseren henger seg. Du må tvangslukke fanen for å stoppe det.
Evighetsløkker skjer oftest ved to feil. Den første er å glemme i++ helt. Da forblir i på 0, og betingelsen i < 10 er alltid sann. Den andre feilen er å skrive en betingelse som aldri kan bli falsk, for eksempel i > 0 && i < 10 når i starter på 0. Siden 0 ikke er større enn 0, kjører løkken aldri. Det er ikke en evighetsløkke, men den gjør heller ingenting.
do-while: garantert minst én kjøring
En vanlig while-løkke sjekker betingelsen før den kjører kodeblokken. Det betyr at hvis betingelsen er falsk fra starten, kjøres koden aldri. En do-while-løkke snur på rekkefølgen:
let i = 0;
do {
print("Hallo");
i++;
} while (i < 10);
Her kjøres kodeblokken først, og betingelsen sjekkes etterpå. Det garanterer at koden kjører minst én gang, uansett hva betingelsen sier. I eksemplet fra kurset brukes en betingelse der i må være større enn 0 og mindre enn 10. Med en vanlig while-løkke og i = 0 ville løkken aldri startet, siden 0 ikke er større enn 0. Med do-while kjører koden én gang, i øker til 1, og deretter er betingelsen oppfylt.
Når bør du bruke while fremfor for?
En for-løkke er oftest det beste valget når du vet på forhånd hvor mange ganger løkken skal kjøre, for eksempel når du itererer gjennom en array. While-løkker passer bedre i situasjoner der antall gjennomkjøringer er ukjent på forhånd.
Tenk deg at du leser data fra en kilde og ikke vet når dataen tar slutt. Eller at du venter på en bestemt hendelse, som at en bruker taster inn riktig passord. I slike tilfeller gir while-løkken mer mening, fordi du ikke har et fast tall å sette i betingelsen. Du sjekker bare om en tilstand fortsatt gjelder, og lar løkken kjøre til den endres.
While-løkken og DRY-prinsippet
Løkker er et direkte svar på DRY-prinsippet. I stedet for å skrive print("Hallo") ti ganger, skriver du det én gang og lar løkken gjenta. Men fordelen strekker seg lenger enn å spare tastetrykk. Trenger du å endre teksten fra "Hallo" til "Velkommen", gjør du det på ett sted i stedet for ti. Trenger du å endre fra ti til hundre gjentakelser, endrer du bare tallet i betingelsen.
Denne tankegangen er grunnleggende i all programmering. Når du ser deg selv kopiere kode, er det et signal om at en løkke kan gjøre jobben bedre.
Neste steg
While-løkker er den enkleste formen for løkker i JavaScript, og gir deg en solid forståelse av hva løkker gjør. I praksis bruker du oftere for-løkker, spesielt når du jobber med arrays. For-løkken samler tellervariabel, betingelse og oppdatering i én linje, noe som gir renere kode og reduserer risikoen for evighetsløkker. For en komplett oversikt over alle løkketyper i JavaScript, se MDN sin guide til loops and iteration.
Denne videoen er hentet fra kurset JavaScript for nybegynnere på Utdannet.no. Instruktør Lars Vidar Nordli tar deg gjennom while-løkker, for-løkker og do-while, og viser hvordan du bruker dem sammen med arrays og funksjoner i praktiske prosjekter.
