Undvik föråldrade closures
Förstå när closures fångar gamla värden och hur buggar kan förhindras.
Undvik föråldrade closures är en gratis lektion i Sveltejs Academy på CoddyKit. Detta är lektion 4 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för Sveltejs Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Sveltejs Academy innehåller totalt 4 lektioner.
Vad är en closure
En closure fångar variabler från det omslutande scopet. Värdena den ser är de som fanns när den skapades.
Föråldrade variabelvärden
Om Ni skapar en funktion som fångar en variabel kanske senare ändringar av variabeln inte syns inuti funktionen.
Svelte-specifika detaljer
Reaktiva variabler uppdateras vid tilldelning. En infångad ögonblicksbild uppdateras INTE automatiskt.
Exempel på problem
Ett intervall som startas i onMount kan logga det ursprungliga antalet i stället för det aktuella.
onMount(() => setInterval(() => console.log(count), 1000));Lösningar: läs om
Använd en funktion som läser det senaste värdet på nytt vid varje tick.
onMount(() => setInterval(() => console.log(getCount()), 1000));Lösningar: stores
Läs från en store med get(store) för att alltid få det senaste värdet.
Reaktiv sats
Starta om intervallet med en reaktiv sats när dess beroenden ändras, så att nya värden fångas in.
Rensa upp noggrant
Om Ni glömmer att rensa intervall läcker tillstånd mellan renderingar. Para ihop varje setInterval med clearInterval.
Asynkrona fallgropar
Långa await-uttryck i en funktion fångar tillståndet vid await-tillfället. Mutationer mellan await-uttryck blir osynliga.
Hjälp från TypeScript
Strikt läge och lintregler kan flagga closures som riskerar att innehålla föråldrade värden.
Testa buggar med föråldrade värden
Skriv tester som uppdaterar tillståndet och sedan utlöser infångade callback-funktioner för att upptäcka föråldrade värden.
Snabb kontroll
Hur undviker Ni föråldrade closures med en store?
Sammanfattning
Closures fångar referenser. I långlivade callback-funktioner bör Ni föredra stores eller hjälpfunktioner som läser om värden för att undvika föråldrade värden.
Lär dig HTML 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
- 41
- Lektioner
- 163
Vanliga frågor
Är lektionen ”Undvik föråldrade closures” gratis?
Ja – hela texten till ”Undvik föråldrade closures” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i Sveltejs Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i Sveltejs Academy innehåller totalt 4 lektioner.
Vad lär jag mig i ”Undvik föråldrade closures”?
Förstå när closures fångar gamla värden och hur buggar kan förhindras. Ni övar på Sveltejs 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 Sveltejs Academy?
Du behöver inga förkunskaper. Utbildningen i Sveltejs 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 4 av 4.
Hur lång tid tar lektionen ”Undvik föråldrade closures”?
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 Sveltejs Academy-lektionen?
Ja. Varje Sveltejs 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
- Reaktiva satser: $:-block
- Reaktiva beroenden och ordning
- När ska stores respektive lokalt tillstånd användas?
- Undvik föråldrade closures