Macrotasks og oppgavekøen
Forstå hvordan tidtakere og I/O planlegges.
Macrotasks og oppgavekøen er en gratis leksjon i JavaScript Academy på CoddyKit. Dette er leksjon 2 av 4. Du kan lese valgfritt 3 leksjoner fra denne læringsstien gratis i sin helhet – deretter låser CoddyKit PRO opp alle leksjoner, samt praktisk øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i JavaScript Academy, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i JavaScript Academy inneholder totalt 4 leksjoner.
Hva er en macrotask?
En macrotask (også kalt en task) er en arbeidsenhet som er planlagt kjørt senere, etter at den gjeldende synkrone koden er ferdig. Callback-funksjoner fra setTimeout er det klassiske eksempelet.
Macrotasks venter i task queue til kallstakken er tom.
setTimeout utsetter arbeid
setTimeout registrerer en callback-funksjon som skal kjøre senere. Selv med en forsinkelse på 0 kjører den etter all gjeldende synkrone kode.
console.log('first');
setTimeout(() => console.log('third (timeout)'), 0);
console.log('second');Task queue
Når en tidtaker utløper, plasseres callback-funksjonen i task queue. Event loop henter én task fra denne køen først når kallstakken er tom, kjører den til den er ferdig, og sjekker deretter på nytt.
console.log('sync start');
setTimeout(() => console.log('task 1'), 0);
setTimeout(() => console.log('task 2'), 0);
console.log('sync end');Tasks kjøres i kø-rekkefølge
Tasks med samme forsinkelse kjøres i den rekkefølgen de ble planlagt. Task queue er FIFO: First In, First Out.
setTimeout(() => console.log('A'), 0);
setTimeout(() => console.log('B'), 0);
setTimeout(() => console.log('C'), 0);
console.log('sync');Forsinkelsen er et minimum, ikke et nøyaktig tidspunkt
Forsinkelsen De oppgir, er den minste tiden før callback-funksjonen kan kjøres. Den faktiske kjøringen skjer først når stakken er tømt og tidligere tasks er ferdige, så den kan skje senere.
setTimeout(() => console.log('100ms'), 100);
setTimeout(() => console.log('0ms'), 0);
console.log('synchronous runs first');Sortering etter forsinkelse
Ulike forsinkelser endrer rekkefølgen: kortere forsinkelser blir klare tidligere, så de kjøres vanligvis før lengre forsinkelser, uavhengig av planleggingsrekkefølgen.
setTimeout(() => console.log('50'), 50);
setTimeout(() => console.log('10'), 10);
setTimeout(() => console.log('30'), 30);
console.log('start');Én macrotask per runde
Event loop kjører nøyaktig én macrotask per runde, og utfører deretter annet arbeid før neste runde. Dette holder systemet responsivt mellom tasks.
console.log('1');
setTimeout(() => {
console.log('2');
setTimeout(() => console.log('4'), 0);
}, 0);
setTimeout(() => console.log('3'), 0);Nøstede timere legges i kø senere
En tidtaker som planlegges inne i en task, legges i kø bak tasks som allerede venter, og kjøres derfor i en senere runde av event loop.
setTimeout(() => {
console.log('outer');
setTimeout(() => console.log('inner nested'), 0);
}, 0);
setTimeout(() => console.log('sibling'), 0);setInterval lager også macrotasks
setInterval planlegger en gjentakende macrotask. Her kjører vi noen få iterasjoner og stopper med clearInterval for å holde mengden utdata begrenset.
let count = 0;
const id = setInterval(() => {
count++;
console.log('tick ' + count);
if (count === 3) clearInterval(id);
}, 10);
console.log('interval scheduled');Synkron kode vinner alltid
Uansett hvor liten forsinkelsen er, venter alle macrotasks bak all synkron kode i den gjeldende kjøringen. Stakken må tømmes først.
setTimeout(() => console.log('macrotask'), 0);
for (let i = 1; i <= 3; i++) console.log('sync ' + i);
console.log('done sync');Hvorfor macrotasks er viktige
Macrotasks lar Dem utsette arbeid uten å blokkere. Hvis De deler en tung jobb opp i tidsstyrte deler, holder det appen responsiv. Macrotasks har imidlertid ikke høyest prioritet: Microtasks (Promises) kjører før neste macrotask, slik De skal se videre.
console.log('schedule');
setTimeout(() => console.log('runs after sync'), 0);
console.log('still sync');Kort kontroll
Når kjører en callback-funksjon fra setTimeout(cb, 0)?
Oppsummering: macrotasks
De har lært hvordan utsatt arbeid planlegges:
- Macrotasks (
setTimeout,setInterval) venter i task queue. - Køen er FIFO, og event loop kjører én task per runde.
- Forsinkelsen er et minimum, og synkron kode kjører alltid først.
- Microtasks har høyere prioritet, noe De skal utforske videre.
Lær deg JavaScript med en AI-veileder – gratis
Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.
- Kurs
- 59
- Leksjoner
- 200
Ofte stilte spørsmål
Er leksjonen «Macrotasks og oppgavekøen» gratis?
Ja – du kan lese valgfritt 3 av leksjonene i læringsstien JavaScript Academy, inkludert «Macrotasks og oppgavekøen», gratis i sin helhet her på nettet. Deretter låser CoddyKit PRO opp alle leksjoner, samt interaktiv øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Kurset i JavaScript Academy inneholder totalt 4 leksjoner.
Hva lærer jeg i «Macrotasks og oppgavekøen»?
Forstå hvordan tidtakere og I/O planlegges. Du øver på JavaScript Academy med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.
Trenger jeg erfaring for å begynne med JavaScript Academy?
Ingen tidligere erfaring er nødvendig. JavaScript Academy på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 2 av 4.
Hvor lang tid tar leksjonen «Macrotasks og oppgavekøen»?
De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.
Kan jeg skrive og kjøre kode i denne JavaScript Academy-leksjonen?
Ja. Alle JavaScript Academy-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.
Alle leksjonene i dette kurset
- Kallstakken
- Macrotasks og oppgavekøen
- Microtasks og Promises
- queueMicrotask og rekkefølge