javascript - array - ¿Cuál es la diferencia entre Object.assign y JSON.parse(JSON.stringify(obj)) para la clonación profunda de un objeto?

print json javascript

Question

Quiero saber si hay alguna diferencia entre

Object.assign({}, obj)

y

JSON.parse(JSON.stringify(obj))

¿Para la clonación profunda de un objeto? ¿Alguien puede explicar si tiene alguna idea?

Answer 1

Creo que el resultado es el mismo, pero hay una diferencia en la prueba de rendimiento, object.assign es mucho más rápido que JSON.parse (JSON.stringify (obj)).

Entonces, si te importa el rendimiento, es mejor usar object.assign

Revisa el siguiente enlace:

JSON.parse(JSON.stringify(obj)) vs Object.assign({}, obj) benchmark

Answer 2

La diferencia es que

Object.assign({}, obj)

crea una copia superficial , no deep , mientras que

JSON.parse(JSON.stringify(obj))

serializes el objeto como una cadena JSON y luego lo deserializa, creando efectivamente una copia profunda.

Una copia superficial está bien, si todas sus propiedades apuntan a valores primitivos, o si no tiene la intención de mutar objetos referenciados por la copia. Si lo hace, los cambios serán visibles tanto en el original como en la copia superficial, porque ambos hacen referencia al mismo objeto:

> let a = { k: { h: 1 } };
> let b = Object.assign({}, a);
> b.k.h = 2;
> a
{ k: { h: 2 } }
> b
{ k: { h: 2 } }

Por supuesto, puede mutar la copia en sí misma sin que tenga ningún efecto sobre el original:

> b.j = 4
> b.k = { new: ''object'' }
> a
{ k: { h: 2 } }
> b
{ k: { new: ''object'' }, j: 4 }

El truco serializar-deserializar por otro lado crea una copia profunda donde todo se crea desde cero:

> let c = JSON.parse(JSON.stringify(b));
> c
{ k: { h: 2 } }
> c.k.h = 3
> c
{ k: { h: 3 } }
> a
{ k: { h: 2 } }
> b
{ k: { h: 2 } }

Otra forma de inspeccionar las identidades es mediante la igualdad estricta:

> let a = { k: { h: 1 } };
> let b = Object.assign({}, a);
> a.k === b.k // both point to the same object
true
> let c = JSON.parse(JSON.stringify(b));
> c.k === b.k // different objects
false