logo

Comment cloner un tableau en JavaScript ?

Dans Javascript, cloner un tableau signifie créer un nouveau tableau avec les mêmes éléments que le tableau d'origine. Le clonage d'un tableau en JavaScript est utile lorsque vous souhaitez créer un nouveau tableau contenant les mêmes éléments qu'un tableau existant, sans modifier le tableau d'origine.

Quand cloner la baie ?

Si vous souhaitez effectuer certaines opérations sur un tableau, telles que le tri, le filtrage ou le mappage, mais que vous ne souhaitez pas modifier le tableau d'origine, vous pouvez créer un clone du tableau d'origine et effectuer les opérations sur le clone à la place.

  • Lorsque vous transmettez un tableau à une fonction en tant qu'argument, vous souhaiterez peut-être vous assurer que la fonction ne modifie pas le tableau d'origine. Dans ce cas, vous pouvez plutôt transmettre un clone du tableau.
  • Si vous souhaitez conserver le tableau d'origine pour référence future, vous pouvez créer un clone du tableau d'origine et utiliser le clone pour un traitement ou une manipulation ultérieur.
  • Si vous disposez d'un tableau qui contient des objets ou des tableaux en tant qu'éléments et que vous souhaitez éviter de modifier les objets ou les tableaux d'origine, vous pouvez créer un clone du tableau avec lequel travailler, afin que les modifications apportées aux objets ou aux tableaux dans le clone ne soient pas modifiées. affecter les objets ou les tableaux d'origine.

Ainsi, cloner un tableau en JavaScript est une technique utile pour travailler avec des tableaux de manière à préserver l'intégrité du tableau d'origine et de ses éléments.



Voici quelques cas d’utilisation courants pour cloner un tableau :

Table des matières

qu'est-ce que s en python

Utilisation de la méthode Array.slice()

Nous utilisons le méthode de tranche pour créer une copie superficielle d'un tableau. Cette méthode crée un nouveau tableau avec un sous-ensemble des éléments du tableau d'origine.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

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

Sortir
[ 1, 2, 3 ]>

Utilisation de l'opérateur de propagation

En utilisant le opérateur de propagation est un moyen concis et simple de cloner un tableau en JavaScript. L'opérateur spread vous permet d'étendre un tableau en éléments individuels, qui peuvent ensuite être utilisés pour créer un nouveau tableau.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

sinon dans le shell bash
Javascript
const originalArray = [1, 2, 3]; const clonedArray = [...originalArray]; console.log(clonedArray);>

Sortir
[ 1, 2, 3 ]>

Utilisation de la méthode Array.from()

En utilisant le Tableau.from() La méthode est une autre façon de cloner un tableau en JavaScript. Cette méthode crée un nouveau tableau à partir d'un tableau existant, en utilisant une fonction de mappage facultative pour transformer les valeurs du nouveau tableau.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

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

Sortir
[ 1, 2, 3 ]>

Utilisation de la méthode Array.concat()

En utilisant le Tableau.concat() La méthode est une autre façon de cloner un tableau en JavaScript. Cette méthode crée un nouveau tableau en concaténant deux ou plusieurs tableaux ensemble.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

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

Sortir
[ 1, 2, 3 ]>

Utiliser une boucle for

Cette méthode consiste à parcourir chaque élément du tableau d'origine et à copier chaque élément dans un nouveau tableau.

mockito à chaque fois

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

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

Sortir
[ 1, 2, 3 ]>

Utilisation de la méthode Array.map()

En utilisant le Tableau.map() La méthode est une autre façon de cloner un tableau en JavaScript. Cette méthode crée un nouveau tableau en mappant chaque élément du tableau d'origine à une nouvelle valeur.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

booléen en chaîne
Javascript
const originalArray = [1, 2, 3]; const clonedArray = originalArray.map(x =>X); console.log(clonedArray);>

Sortir
[ 1, 2, 3 ]>

Utilisation de la méthode Array.from() avec une fonction map

En utilisant le Tableau.from() méthode avec une fonction map est une autre façon de cloner un tableau en JavaScript. Cette méthode crée un nouveau tableau en mappant chaque élément du tableau d'origine à une nouvelle valeur à l'aide d'une fonction fournie.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

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

Sortir
[ 1, 2, 3 ]>

Utilisation de la méthode Array.of()

Cette méthode crée un nouveau tableau avec les mêmes éléments que le tableau d'origine.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

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

Sortir
[ 1, 2, 3 ]>

Utilisation des méthodes JSON.parse() et JSON.stringify()

En utilisant le JSON.parse() et JSON.stringify() Les méthodes sont une autre façon de cloner un tableau en JavaScript. Cette méthode consiste à convertir le tableau d'origine en chaîne JSON, puis à analyser la chaîne JSON pour créer un nouveau tableau.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

boucle for dans un script shell
Javascript
const originalArray = [1, 2, 3]; const clonedArray = JSON.parse(JSON.stringify(originalArray)); console.log(clonedArray);>

Sortir
[ 1, 2, 3 ]>

Utilisation de la méthode Object.assign()

En utilisant le Objet.assign() méthode est une autre façon de cloner un tableau en JavaScript. Cette méthode crée un nouveau tableau en copiant les propriétés du tableau d'origine dans un nouvel objet.

Exemple: Cet exemple montre la mise en œuvre de l’approche expliquée ci-dessus.

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

Sortir
[ 1, 2, 3 ]>

Utilisation de la méthode Array.reduce()

Le Méthode Array.reduce() exécute une fonction de réduction sur chaque élément du tableau, ce qui donne une valeur de sortie unique. Nous pouvons l'utiliser pour construire un nouveau tableau avec les mêmes éléments que le tableau d'origine.

Syntaxe:

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

Exemple : Dans cet exemple, nous utiliserons la méthode Array.reduce() pour créer un clone d'un tableau.

Javascript
// Input array const originalArray = [1, 2, 3, 4]; // Cloning the array using reduce const clonedArray = originalArray.reduce((acc, val) =>{ acc.push(val);  retour acc; }, []); // Afficher les tableaux d'origine et clonés console.log('Original Array:', originalArray); // Sortie : [1, 2, 3, 4] console.log('Cloned Array:', clonedArray); // Sortie : [1, 2, 3, 4]>

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

Note: Ainsi, lors du clonage d'une baie, il est important de prendre en compte la complexité des données et les exigences de performances de l'application.