Comment utiliser la copie profonde et superficielle JS dans des projets pratiques

Cette fois, je vais vous expliquer comment utiliser la copie profonde et superficielle JS dans des projets pratiques, et quelles sont les précautions à prendre pour utiliser la copie profonde et superficielle JS dans des projets pratiques. Ce qui suit est un cas pratique, jetons un coup d'œil. .

Les exemples de cet article décrivent les concepts et l'utilisation de la copie approfondie et de la copie superficielle JavaScript. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants : la copie superficielle et la copie profonde dans

js sont uniquement destinées à copier des types de données complexes (Objcet, Array. ) . Pour faire simple, la copie superficielle et la copie profonde peuvent réaliser la fonction de régénération d'une copie basée sur l'objet original. Cependant, selon que l'objet nouvellement généré peut affecter l'objet d'origine, il peut être divisé en copie superficielle et copie profonde.

Concept 1 : Copie superficielle

La copie superficielle fait référence à la copie de références. La référence nouvellement générée et la référence originale pointent toutes deux vers des instances du même objet et s'excluent mutuellement. . Les opérations s’influenceront mutuellement.

Concept 2 : Copie profonde

Rouvrez la mémoire dans le tas et copiez tout le contenu de l'instance d'objet correspondant à la référence d'origine, assurant ainsi une copie profonde. L'objet est complètement isolé de l'objet d'origine et ils n'ont aucune influence l'un sur l'autre.

Concept 3 : Implémentation de la copie profonde de tableau

1 Utiliser la for boucle

<script type="text/javascript">
  var arr1=['a','b','c'];
  var arr2=[];
  function deepCopy(arr1,arr2){
    for(var i=0;i<arr1.length;i++){
      arr2[i]=arr1[i];
    }
  }
  deepCopy(arr1,arr2);
  arr2[1]=&#39;d&#39;;
  console.log(arr1);//[&#39;a&#39;,&#39;b&#39;,&#39;c&#39;]
  console.log(arr2);//[&#39;a&#39;,&#39;d&#39;,&#39;c&#39;]
</script>

2 Utiliser la méthode slice()<.>

<script type="text/javascript">
  var arr1=['a','b','c'];
  var arr2=arr1.slice(0);
  arr2[1]='d';
  console.log(arr1);//['a','b','c']
  console.log(arr2);//['a','d','c']
</script>

3. Utilisez la méthode

concat

<script type="text/javascript">
    var arr1=['a','b','c'];
    var arr2=arr1.concat();
    arr2[1]='d';
    console.log(arr1);//['a','b','c']
    console.log(arr2);//['a','d','c']
</script>

Concept 4 : Copie approfondie de l'objet

1. 🎜> boucle

for

2. Utilisez

<script type="text/javascript">
  var obj = {
    name: 'FungLeo',
    sex: 'man',
    old: '18'
  }
  function copyObj(obj) {
    let res = {}
    for (var key in obj) {
      res[key] = obj[key]
    }
    return res
  }
  var obj2 = copyObj(obj);
  obj2["name"]="kka";
</script>

JSON

pour réaliser

Je crois que vous maîtrisez la méthode après avoir lu le cas dans cet article. des choses passionnantes, veuillez faire attention aux autres sites Web chinois php Articles connexes !

<script type="text/javascript">
  var obj = {
    name: 'FungLeo',
    sex: 'man',
    old: '18'
  }
  var obj2=JSON.parse(JSON.stringif(obj));
  obj2["name"]="kka";
</script>

Lecture recommandée :

échafaudage vue et installation vue-cli

Utilisation immédiate de watch in vue project

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!