derived() para stores calculados
Derive un nuevo store cuyo valor se calcule a partir de uno o más stores
derived() para stores calculados es una lección gratuita de Sveltejs Academy en CoddyKit. Esta es la lección 1 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Sveltejs Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Sveltejs Academy incluye 4 lecciones en total.
Qué hace derived
derived crea un store nuevo cuyo valor se calcula a partir de uno o más stores de origen.
Importarlo
Desde svelte/store.
import { derived } from "svelte/store";Una sola fuente
Derive el valor de un store: páselo junto con una función que devuelva el valor derivado.
export const doubled = derived(count, ($count) => $count * 2);Varias fuentes
Pase un array de stores; el callback recibe un array con sus valores.
export const total = derived([price, qty], ([$p, $q]) => $p * $q);Derived asíncrono
Pase un segundo argumento set y llámelo de forma asíncrona para derivar el valor de una fuente asíncrona.
derived(userId, ($id, set) => {
fetchUser($id).then(set);
});Valor inicial
Los derived asíncronos aceptan un tercer argumento como valor inicial antes de llamar a set.
Limpieza automática
Al igual que otros stores, derived limpia automáticamente las suscripciones a sus fuentes.
Encadenamiento
Los stores derived pueden actuar como fuentes para otros derived.
Memoización
El valor derivado solo se actualiza cuando cambian los valores de origen. Equivale a los selectores memoizados.
Usarlo en componentes
Consúmalo con la forma abreviada $, como cualquier otro store.
<p>Total: {$total}</p>Cuándo usarlo
Use derived para el estado compartido calculado; para valores calculados locales del componente, prefiera $:.
Comprobación rápida
¿Qué devuelve derived?
Repaso
derived construye stores calculados de solo lectura a partir de una o varias fuentes. Admite derivaciones síncronas y asíncronas.
Preguntas frecuentes
¿La lección «derived() para stores calculados» es gratis?
Sí — el texto completo de «derived() para stores calculados» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Sveltejs Academy, actualiza a CoddyKit PRO. El curso de Sveltejs Academy incluye 4 lecciones en total.
¿Qué aprenderé en «derived() para stores calculados»?
Derive un nuevo store cuyo valor se calcule a partir de uno o más stores Practicas Sveltejs Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Sveltejs Academy?
No se requiere experiencia previa. Sveltejs Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 1 de 4.
¿Cuánto tiempo toma la lección «derived() para stores calculados»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Sveltejs Academy?
Sí. Cada lección de Sveltejs Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- derived() para stores calculados
- Patrón de store personalizado con subscribe/set/update
- Readable a partir de Writable
- Contratos de stores e interoperabilidad