#ES6 Façon de cloner un tableau
Lorsque nous avons besoin de copier un tableau, nous avons souvent utilisé slice. Mais avec ES6, vous pouvez également utiliser l’opérateur de propagation pour dupliquer un tableau. Assez astucieux, non right
const sheeps = ;// Old wayconst cloneSheeps = sheeps.slice();// ES6 wayconst cloneSheepsES6 = ;
# Pourquoi ne puis-je pas Utiliser = pour copier un tableau?
Parce que les tableaux dans JS sont des valeurs de référence, donc lorsque vous essayez de le copier en utilisant le =
il ne copiera que la référence au tableau d’origine et non la valeur du tableau. Pour créer une copie réelle d’un tableau, vous devez copier la valeur du tableau sous une nouvelle variable de valeur. De cette façon, ce nouveau tableau ne fait pas référence à l’ancienne adresse du tableau en mémoire.
const sheeps = ;const fakeSheeps = sheeps;const cloneSheeps = ;console.log(sheeps === fakeSheeps);// true --> it's pointing to the same memory spaceconsole.log(sheeps === cloneSheeps);// false --> it's pointing to a new memory space
# Problème avec les valeurs de référence
Si vous avez déjà eu affaire à Redux ou à un cadre de gestion d’état. Vous saurez que l’immuabilité est très importante. Permettez-moi de vous expliquer brièvement. Un objet immuable est un objet dont l’état ne peut pas être modifié après sa création. Le problème avec JavaScript est que arrays
sont mutables. Cela peut donc arriver:
const sheeps = ;const sheeps2 = sheeps;sheeps2.push('🐺');console.log(sheeps2);// // Ahhh 😱 , our original sheeps have changed?!console.log(sheeps);//
C’est pourquoi nous devons cloner un tableau:
const sheeps = ;const sheeps2 = ;// Let's change our sheeps2 arraysheeps2.push('🐺');console.log(sheeps2);// // ✅ Yay, our original sheeps is not affected!console.log(sheeps);//
# Types de données mutables vs Immuables
Mutable:
- objet
- tableau
- function
Immuable :
Toutes les primitives sont immuables.
- chaîne
- nombre
- booléen
- null
- non défini
- symbole
# Copie superficielle uniquement
Veuillez noter que spread
ne va qu’à un niveau de profondeur lors de la copie d’un tableau. Donc, si vous essayez de copier des tableaux multidimensionnels, vous devrez utiliser d’autres alternatives.
const nums = , ];const cloneNums = ;// Let's change the first item in the first nested item in our cloned array.cloneNums = '👻';console.log(cloneNums);// , , ]// NOOooo, the original is also affectedconsole.log(nums);// , , ]
Here Voici une chose intéressante que j’ai apprise. Copie superficielle signifie que le premier niveau est copié, les niveaux plus profonds sont référencés.
# Entrée de la communauté
# Tableau.de est une autre Façon de cloner un tableau
const sheeps = ;const cloneSheeps = Array.from(sheeps);
_ Merci: @hakankaraduman_
-
_ @hakankaraduman :_ oui, j’essaie de ne pas utiliser de spread, ça me confond en lisant le code car il fait deux choses, la propagation ou la collecte en fonction du contexte
-
CJ J: Je pense que le meilleur moyen est celui qui correspond le mieux à la sémantique de l’opération. Je préfère utiliser
Array.from
Leave a Reply