Cómo clonar en profundidad una matriz en JavaScript

Blog

Cómo clonar en profundidad una matriz en JavaScript

JavaScript ofrece muchas formas de copiar un objeto, pero no todas proporcionan una copia profunda. Aprenda de la manera más eficiente y descubra también todas las opciones que tiene



Aquí hay 2 formas de clonar en profundidad una matriz. Para una manera rápida y sucia, use los métodos JSON.






Hay 2 tipos de clonación de matrices: superficial y profunda. Las copias superficiales solo cubren el primer nivel de la matriz y se hace referencia al resto. Si desea una copia fiel de las matrices anidadas, necesitará un clon profundo. Para clones profundos, siga el método JSON O mejor aún use Lodash



|_+_|

Las matrices son tipos de referencia

Para entender por qué existen dos tipos de clonación. Profundicemos en los fundamentos y expliquemos qué son los tipos de referencia.



A diferencia de sus tipos primitivos (es decir, número o cadena), las matrices son tipos de referencia. Lo que significa que cuando asigna una matriz a una variable, está asignando una dirección de memoria y no la matriz real en sí. WTH. Sé que esto es un poco confuso. Entonces, expliquemos con un ejemplo.






Copiar un tipo de valor

Así que no hay problema aquí. Estamos creando una copia de const numbers = [1, [2], [3, [4]], 5]; // Using JavaScript JSON.parse(JSON.stringify(numbers)); // Using Lodash _.cloneDeep(objects); . Y si cambiamos el value, no afecta al original valueCopy. Tiene sentido: cuando cambiamos la copia, no debería afectar al original en absoluto. Todo bien aquí

|_+_|

Copiar un tipo de referencia

Bien, las cosas están a punto de ponerse raras ahora. Copiemos nuestra matriz usando el mismo método que usamos para copiar un tipo de valor.

|_+_|

¿Por qué la matriz original también se vio afectada? Eso es porque lo que copió no es la matriz en sí, sino el puntero al espacio de memoria que ocupa la matriz. Los tipos de referencia no contienen valores, son un puntero al valor en la memoria.

Solución para copiar tipos de referencia

Entonces, la solución es copiar el valor, NO el puntero. Como esto:

|_+_|

Clon superficial vs profundo

Cuando usé spread value para copiar una matriz, solo estoy creando una copia superficial. Si la matriz está anidada o es multidimensional, no funcionará. Vamos a ver:

|_+_|

Como puede ver, la capa superficial o primera está bien. Sin embargo, una vez que cambiamos el elemento anidado, la matriz original también se vio afectada. Entonces la solución es hacer un clon profundo:

|_+_|

Recursos

#javascript #arreglos