Introducción

Este post será muy muy sencillo pero espero que a alguien más le sirva. Sucede que estoy trabajando con un proyecto utilizando VueJS, y por alguna razón tenía que “copiar” un objeto.

Es decir, necesitaba crear una nueva copia de un objeto, sin mantener las referencias del original. Si no sabes a lo que me refiero, pásate por este post.

Después de buscar, encontré algo de ES6 que permite hacer casi lo mismo. Extrañaba esta función, que en AngularJS se llama angular.copy.

Object.assign

Para eliminar todas las referencias y crear una copia “limpia” únicamente con los valores, podemos asignar a un objeto vacío el objeto origen. Es simple como se ve a continuación:

let mascota = {
 nombre: "Maggie",
 edad: 2
};

let mascotaNueva = Object.assign({}, mascota); 
// Ahora mascotaNueva es un nuevo y limpio objeto. Por lo que, si modificamos mascota, mascotaNueva quedará intacta

Si no queda claro, observemos este GIF.

Sin crear un nuevo objeto

Creando un nuevo objeto, cuyos cambios no afectan a otro

La desventaja de esto si es que se le puede llamar así, es que es una nueva función introducida por ES6 y por lo tanto no todos los navegadores lo soportan.