$derived : valeurs calculées déclaratives
Calculez des valeurs qui se mettent automatiquement à jour lorsque leurs dépendances changent.
$derived : valeurs calculées déclaratives est une leçon Sveltejs Academy gratuite sur CoddyKit. Ceci est la leçon 3 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Sveltejs Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Sveltejs Academy comprend 4 leçons au total.
État calculé
Utilisez $derived(expr) pour calculer une valeur à partir de sources réactives.
let count = $state(0);
let doubled = $derived(count * 2);Suivi automatique
Svelte suit automatiquement les dépendances de l’expression. La valeur dérivée est mise à jour lorsqu’une source change.
Lecture seule
Les valeurs dérivées ne peuvent pas être affectées directement : elles reflètent toujours le calcul.
Utiliser dans le balisage
Lisez les valeurs dérivées comme n’importe quel état.
<p>Doubled: {doubled}</p>Évaluation différée
Les valeurs dérivées sont calculées à la demande lors de leur lecture : si personne ne les lit, ce coût est évité.
Mise en cache
Le résultat est mis en cache jusqu’à ce qu’une source change : aucun recalcul répété à chaque lecture.
Logique complexe
Pour une logique composée de plusieurs instructions, utilisez la forme $derived.by(() => { ... }).
Comparaison avec $:
$derived remplace $: x = .... Cette syntaxe est plus explicite et fonctionne en dehors des fichiers .svelte.
Inférence des types
TypeScript déduit automatiquement les types à partir de l’expression.
Aucun effet secondaire
Une valeur dérivée doit être pure. Pour les effets secondaires, utilisez $effect.
Performances
La valeur est mémorisée et recalculée uniquement lorsque ses dépendances changent.
Vérification rapide
Que renvoie $derived ?
Récapitulatif
$derived est la manière moderne et explicite de déclarer des valeurs calculées. Utilisez $derived.by pour une logique composée de plusieurs lignes.
Questions Fréquemment Posées
La leçon « $derived : valeurs calculées déclaratives » est-elle gratuite ?
Oui — le texte complet de « $derived : valeurs calculées déclaratives » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Sveltejs Academy, passe à CoddyKit PRO. Le cours Sveltejs Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « $derived : valeurs calculées déclaratives » ?
Calculez des valeurs qui se mettent automatiquement à jour lorsque leurs dépendances changent. Tu pratiques Sveltejs Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer Sveltejs Academy ?
Aucune expérience préalable n'est requise. Sveltejs Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 3 sur 4.
Combien de temps prend la leçon « $derived : valeurs calculées déclaratives » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon Sveltejs Academy ?
Oui. Chaque leçon Sveltejs Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Pourquoi les runes : au-delà de la magie du compilateur
- $state : réactivité fine
- $derived : valeurs calculées déclaratives
- $effect : effets secondaires