Matriz De Copia De Javascript

| | | | | | | | | | | | | | | | | | | | | |

En JavaScript , copiar una matriz no es tan simple como usar el operador de asignaciòn (=) para crear un duplicado. Si alguna vez ha probado esto, se sorprenderá al descubrir que solo crea un enlace a la lista original. ¿Cuál es el trato?

En esta guìa, vamos a hablar sobre còmo copiar una matriz de JavaScript. Analizaremos el còdigo de tres estrategias de matriz de copia de JavaScript para que pueda empezar a copiar matrices.

El problema con la copia de matrices de JavaScript

En alg√∫n nivel, el " = & rdquo ; El operador crea una copia de una matriz en una nueva variable . Sin embargo, es más un puntero que una copia. Esto se debe a que " = " El operador crea una referencia a una matriz original. No crea un duplicado de la matriz existente. & Nbsp;

Intentemos crear una copia de una matriz utilizando el operador de asignaciòn sin otro còdigo:

Nuestro còdigo devuelve:

Parece que nuestra matriz se ha copiado. " frutas " contiene todos los valores de nuestras " berries " matriz.

Ahora, intentemos agregar un elemento a las " frutas " matriz:

Hemos añadido " Melon " a la variedad de frutas. Luego imprimimos los valores de " frutas " y "bayas" a la consola:

Ambos " frutas " y "bayas" contienen los mismos valores. Eso es porque técnicamente no hemos clonado nuestra matriz. Acabamos de crear una referencia.

Cada vez que manipulamos las " berries " matriz, los cambios se realizarán en " frutas " matriz.

Còmo copiar una matriz de JavaScript

El operador de asignaciòn no copia una matriz. Tenemos que utilizar otro enfoque. Afortunadamente para nosotros, hay muchas formas de crear una copia de una matriz. Los tres enfoques principales son:

  • Usar el operador de propagaciòn
  • Usar un for loop
  • Usando Array.from

Analicemos estos uno por uno.

Uso del operador de propagaciòn

El operador de propagaciòn es una caracterìstica introducida en JavaScript ES6 . Le permite acceder al contenido de un objeto iterable. Este operador se usa a menudo para crear una copia superficial de una matriz.

El operador de extensiòn consta de tres puntos, como una elipsis (& hellip ;). Intentemos crear una copia de nuestra matriz " berries " anterior:

Hemos utilizado el operador de propagaciòn para crear una copia de nuestra matriz. Comprobemos los valores de nuestras matrices para asegurarnos de que sean correctos:

Nuestro còdigo devuelve:

El valor & ldquo ; Melòn " solo se agregò a las " frutas " formaciòn. Esto se debe a que usamos el operador de propagaciòn para crear un duplicado de " berries " formaciòn. Ahora, los " frutos " matriz es su propia matriz. Sus valores están separados de los " berries " matriz.

Usando un bucle for

El método probado y verdadero, usar un bucle for es una buena manera de crear una copia de una matriz.

Este método puede no ser tan favorecido como el operador de propagaciòn porque requiere más lìneas de còdigo. Dicho esto, un bucle for copia bien un objeto.

Hemos declarado dos listas: bayas y frutas. Frutas es inicialmente una lista vacìa. Luego, usamos un bucle for para recorrer todos los elementos de las " berries " lista. Para cada elemento de la lista, el valor se copia en " frutas " matriz.

Ejecutemos nuestra prueba para ver si nuestras matrices están separadas:

Nuestro còdigo devuelve:

¡Éxito! " bayas " y "frutas" son dos matrices separadas.

Usando Array.from ()

El método Array.from () convierte cualquier objeto iterable en una matriz. a través de cada elemento en un iterable y lo agrega a una nueva matriz. Esto significa que se puede usar para copiar una matriz.

Vamos a crear una copia de nuestra matriz " berries " nuevamente:

Esta soluciòn, como la sintaxis del operador de propagaciòn, solo ocupa dos lìneas de còdigo. Es una forma eficiente y concisa de copiar una matriz. Ahora, dejemos y rsquo ; s ejecute una prueba para verificar nuestras nuevas matrices:

Nuestro còdigo devuelve:

Nuestras matrices se han copiado correctamente.

Conclusiòn

Copiar una matriz en JavaScript es fácil cuando sabes còmo.

El operador de asignaciòn no es suficiente para copiar una matriz si quieres cree una versiòn separada de una matriz. Esto se debe a que el operador de asignaciòn crea un puntero a una matriz existente; no crea una nueva matriz.

Puede crear una copia de una matriz usando el operador de extensiòn, un bucle for o el método Array.from () . Ahora está listo para copiar matrices en JavaScript como un experto.