$derived: deklarativa beräknade värden
Beräkna värden som automatiskt uppdateras när deras beroenden ändras.
$derived: deklarativa beräknade värden är en gratis lektion i Sveltejs Academy på CoddyKit. Detta är lektion 3 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.
Beräknat tillstånd
Använd $derived(expr) för att beräkna ett värde från reaktiva källor.
let count = $state(0);
let doubled = $derived(count * 2);Spåras automatiskt
Svelte spårar uttryckets beroenden automatiskt. Det härledda värdet uppdateras när någon källa ändras.
Skrivskyddat
Härledda värden kan inte tilldelas direkt; de återspeglar alltid beräkningen.
Använd i markup
Läs härledda värden på samma sätt som andra tillstånd.
<p>Doubled: {doubled}</p>Lat utvärdering
Härledda värden beräknas först när de läses; om inget läser värdet hoppas kostnaden över.
Cachelagring
Resultatet cachelagras tills en källa ändras – ingen upprepad beräkning vid varje läsning.
Komplex logik
Använd formen $derived.by(() => { ... }) för logik med flera satser.
Jämfört med $:
$derived ersätter $: x = .... Det är tydligare och fungerar utanför .svelte-filer.
Typinferens
TypeScript härleder typer från uttrycket automatiskt.
Inga sidoeffekter
Derived måste vara ren. Använd $effect för sidoeffekter.
Prestanda
Resultatet cachelagras och beräknas endast om när beroendena ändras.
Snabbkontroll
Vad returnerar $derived?
Sammanfattning
$derived är det moderna och explicita sättet att deklarera beräknade värden. Använd $derived.by för logik över flera rader.
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 ”$derived: deklarativa beräknade värden” gratis?
Ja – hela texten till ”$derived: deklarativa beräknade värden” 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 ”$derived: deklarativa beräknade värden”?
Beräkna värden som automatiskt uppdateras när deras beroenden ändras. 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 3 av 4.
Hur lång tid tar lektionen ”$derived: deklarativa beräknade värden”?
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
- Varför runor: bortom kompilatormagin
- $state: finkornig reaktivitet
- $derived: deklarativa beräknade värden
- $effect: sidoeffekter