Sveltejs Academy · Lezione

$derived.by per derivazioni complesse

Calcoli valori derivati con una logica arbitraria usando la forma callback di $derived.

Lezione 2 di 413 passaggi

$derived.by per derivazioni complesse è una lezione Sveltejs Academy gratuita su CoddyKit. Questa è la lezione 2 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Sveltejs Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Sveltejs Academy include 4 lezioni in totale.

Derivazioni con più istruzioni

Per i valori derivati che richiedono più di un'espressione, utilizzi la forma con callback.

let result = $derived.by(() => {
  if (count > 10) return "high";
  if (count > 5) return "medium";
  return "low";
});

Stessa reattività

La callback tiene traccia delle dipendenze nello stesso modo di un $derived a espressione singola.

Maggiore leggibilità

Per la logica complessa, la forma .by è più chiara che racchiudere tutto in un'unica espressione.

Cicli e rami

All'interno della callback può utilizzare cicli for, if-else e let.

Funzioni pure

Come $derived, .by deve essere pura. Non sono ammessi effetti collaterali.

Memoizzazione

Il risultato viene memorizzato nella cache finché le dipendenze non cambiano.

Eviti i calcoli pesanti

Se il calcolo è costoso, consideri la possibilità di memorizzarlo nella cache al di fuori della derivazione.

Inferenza dei tipi

TypeScript inferisce il tipo restituito dalla callback.

Combinare con $effect

Utilizzi $derived.by per i valori calcolati e $effect per gli effetti collaterali. Li mantenga separati.

Migrazione

Converta i blocchi $: annidati in un unico $derived.by per ottenere codice più chiaro.

Casi reali

Utile per filtrare e ordinare liste, calcolare metriche aggregate e applicare formattazioni condizionali.

Verifica rapida

Quando si utilizza $derived.by?

Riepilogo

Utilizzi $derived.by(() => ...) per valori calcolati in più passaggi, con rami o cicli.

Gratis per iniziare

Impara HTML con un tutor IA — gratis

Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.

Corsi
41
Lezioni
163

Domande Frequenti

La lezione «$derived.by per derivazioni complesse» è gratuita?

Sì — il testo completo di «$derived.by per derivazioni complesse» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Sveltejs Academy, passa a CoddyKit PRO. Il corso Sveltejs Academy include 4 lezioni in totale.

Cosa imparerò in «$derived.by per derivazioni complesse»?

Calcoli valori derivati con una logica arbitraria usando la forma callback di $derived. Eserciti Sveltejs Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare Sveltejs Academy?

Non è richiesta alcuna esperienza precedente. Sveltejs Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 2 di 4.

Quanto tempo richiede la lezione «$derived.by per derivazioni complesse»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione Sveltejs Academy?

Sì. Ogni lezione Sveltejs Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

  1. $state.raw per lo stato non reattivo
  2. $derived.by per derivazioni complesse
  3. $effect.root per la pulizia manuale
  4. Migrazione da Svelte 4 a 5
← Torna a Sveltejs Academy