Clonación profunda de objetos con structuredClone en JS
Introducción
En JavaScript, los objetos y arrays se pasan por referencia. Si haces const copia = original, cualquier cambio en la copia afectará al original, causando bugs difíciles de rastrear. El operador spread ({...}) solo hace una copia superficial (shallow copy). La solución definitiva y nativa para una copia real y profunda es el método structuredClone().
Solución Rápida (Código)
const usuario = {
id: 1,
perfil: { nombre: 'Ninja', skills: ['JS', 'CSS'] }
};
// Copia profunda real
const copiaSegura = structuredClone(usuario);
copiaSegura.perfil.nombre = 'Master';
console.log(usuario.perfil.nombre); // Sigue siendo 'Ninja'
Explicación técnica
Históricamente, los desarrolladores usaban JSON.parse(JSON.stringify(obj)) para clonar objetos, pero esta técnica falla con fechas, expresiones regulares, mapas y sets. structuredClone() es una API global moderna que soluciona todos estos problemas, permitiendo clonar estructuras de datos complejas de forma eficiente y sin perder tipos de datos internos.
Es una herramienta vital cuando trabajas con estados inmutables en aplicaciones complejas. Al asegurar que tienes una instancia totalmente independiente, evitas los efectos secundarios (side effects) no deseados que ocurren cuando una parte de tu código modifica datos que otra parte está utilizando. Es más rápido que las soluciones basadas en JSON y más seguro que las implementaciones manuales recursivas que suelen ser propensas a errores de desbordamiento de pila.
Conclusión Entender la mutabilidad te ahorrará horas de depuración. Te invitamos a leer nuestro artículo sobre Inmutabilidad en JavaScript: Por qué es el futuro del desarrollo.