En javascript, clonar una matriz significa crear una nueva matriz con los mismos elementos que la matriz original. Clonar una matriz en JavaScript es útil cuando desea crear una nueva matriz que tenga los mismos elementos que una matriz existente, sin modificar la matriz original.

¿Cuándo clonar una matriz?

Si desea realizar algunas operaciones en una matriz, como ordenar, filtrar o mapear, pero no desea modificar la matriz original, puede crear un clon de la matriz original y realizar las operaciones en el clon.

• Al pasar una matriz a una función como argumento, es posible que desee asegurarse de que la función no modifique la matriz original. En este caso, puede pasar un clon de la matriz.
• Si desea conservar la matriz original para referencia futura, puede crear un clon de la matriz original y utilizar el clon para su posterior procesamiento o manipulación.
• Si tiene una matriz que contiene objetos o matrices como elementos y desea evitar modificar los objetos o matrices originales, puede crear un clon de la matriz para trabajar, de modo que los cambios en los objetos o matrices en el clon no afectan los objetos o matrices originales.

De este modo, clonar una matriz en JavaScript es una técnica útil para trabajar con matrices de una manera que preserve la integridad de la matriz original y sus elementos.

A continuación se muestran algunos casos de uso comunes para clonar una matriz:

Tabla de contenidos

• ¿Cuándo clonar una matriz?
• Usando el método Array.slice()
• Usando el operador de propagación
• Usando el método Array.from()
• Usando el método Array.concat()
• Usando un bucle for
• Usando el método Array.map()
• Usando el método Array.from() con una función de mapa
• Usando el método Array.of()
• Usando los métodos JSON.parse() y JSON.stringify()
• Usando el método Object.assign()
• Usando el método Array.reduce()

Usando el método Array.slice()

Usamos el método de corte para crear una copia superficial de una matriz. Este método crea una nueva matriz con un subconjunto de elementos de la matriz original.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = originalArray.slice(); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el operador de propagación

Utilizando el operador de propagación … es una manera concisa y fácil de clonar una matriz en JavaScript. El operador de extensión le permite expandir una matriz en elementos individuales, que luego se pueden usar para crear una nueva matriz.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = [...originalArray]; console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el método Array.from()

Utilizando el matriz.de() El método es otra forma de clonar una matriz en JavaScript. Este método crea una nueva matriz a partir de una matriz existente, utilizando una función de mapeo opcional para transformar los valores en la nueva matriz.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = Array.from(originalArray); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el método Array.concat()

Utilizando el matriz.concat() El método es otra forma de clonar una matriz en JavaScript. Este método crea una nueva matriz concatenando dos o más matrices.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = [].concat(originalArray); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando un bucle for

Este método implica iterar a través de cada elemento de la matriz original y copiar cada elemento en una nueva matriz.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = []; for (let i = 0; i  < originalArray.length; i++) {  clonedArray.push(originalArray[i]); } console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el método Array.map()

Utilizando el Array.map() El método es otra forma de clonar una matriz en JavaScript. Este método crea una nueva matriz asignando cada elemento de la matriz original a un nuevo valor.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = originalArray.map(x =>X); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el método Array.from() con una función de mapa

Utilizando el matriz.de() método con una función de mapa es otra forma de clonar una matriz en JavaScript. Este método crea una nueva matriz asignando cada elemento de la matriz original a un nuevo valor utilizando una función proporcionada.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = Array.from(originalArray, x =>X); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el método Array.of()

Este método crea una nueva matriz con los mismos elementos que la matriz original.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = Array.of(...originalArray); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando los métodos JSON.parse() y JSON.stringify()

Utilizando el JSON.parse() y JSON.stringify() métodos es otra forma de clonar una matriz en JavaScript. Este método implica convertir la matriz original en una cadena JSON y luego analizar la cadena JSON para crear una nueva matriz.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = JSON.parse(JSON.stringify(originalArray)); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el método Object.assign()

Utilizando el Objeto.asignar() método es otra forma de clonar una matriz en JavaScript. Este método crea una nueva matriz copiando las propiedades de la matriz original a un nuevo objeto.

Ejemplo: Este ejemplo muestra la implementación del enfoque explicado anteriormente.

const originalArray = [1, 2, 3]; const clonedArray = Object.assign([], originalArray); console.log(clonedArray); 

[ 1, 2, 3 ] 

Usando el método Array.reduce()

El Método Array.reduce() ejecuta una función reductora en cada elemento de la matriz, lo que da como resultado un único valor de salida. Podemos usarlo para construir una nueva matriz con los mismos elementos que la matriz original.

Sintaxis:

array.reduce((accumulator, currentValue, currentIndex, array) =>{...}, valor inicial); 

Ejemplo : En este ejemplo, usaremos el método Array.reduce() para crear un clon de una matriz.

// Input array const originalArray = [1, 2, 3, 4]; // Cloning the array using reduce const clonedArray = originalArray.reduce((acc, val) =>{ acc.push(val);  devolución según; }, []); // Muestra las matrices originales y clonadas console.log('Original Array:', originalArray); // Salida: [1, 2, 3, 4] console.log('Cloned Array:', clonedArray); // Salida: [1, 2, 3, 4] 

Original Array: [ 1, 2, 3, 4 ] Cloned Array: [ 1, 2, 3, 4 ] 

Nota: Por lo tanto, al clonar una matriz, es importante considerar la complejidad de los datos y los requisitos de rendimiento de la aplicación.