Est-ce une bonne façon de cloner un objet en ES6 ?

Question

En cherchant sur Google "javascript clone object", on obtient des résultats vraiment étranges, certains sont désespérément dépassés et d'autres sont tout simplement trop complexes, n'est-ce pas aussi simple que ça ?

let clone = {...original};

Y a-t-il quelque chose de mal à cela ?

Answer 1

C'est bien. pour un clonage peu profond . Le site La propagation d'objets est un élément standard de l'ECMAScript 2018. .

Pour le clonage profond, vous aurez besoin d'un solution différente .

const clone = {...original} à un clone peu profond

const newobj = {...original, prop: newOne} pour ajouter de façon immuable un autre accessoire à l'original et le stocker comme un nouvel objet.

Answer 2

EDIT : Quand cette réponse a été postée, {...obj} n'était pas disponible dans la plupart des navigateurs. Aujourd'hui, vous devriez pouvoir l'utiliser sans problème (sauf si vous devez prendre en charge IE 11).

Utilisez Object.assign.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

Cependant, cela ne fera pas un clone profond. Il n'existe pas encore de méthode native de clonage profond.

EDIT : Comme @Mike 'Pomax' Kamermans l'a mentionné dans les commentaires, vous pouvez cloner profondément des objets simples (c'est-à-dire sans prototypes, fonctions ou références circulaires) en utilisant JSON.parse(JSON.stringify(input))

Answer 3

Si les méthodes que vous avez utilisées ne fonctionnent pas bien avec des objets impliquant des types de données tels que Date Essayez ceci

Importation _

import * as _ from 'lodash';

Objet de clonage profond

myObjCopy = _.cloneDeep(myObj);

Answer 4

Vous pouvez aussi le faire comme ça,

let copiedData = JSON.parse(JSON.stringify(data));

Answer 5

Si vous ne voulez pas utiliser json.parse(json.stringify(object)), vous pouvez créer récursivement des copies clé-valeur :

function copy(item){
  let result = null;
  if(!item) return result;
  if(Array.isArray(item)){
    result = [];
    item.forEach(element=>{
      result.push(copy(element));
    });
  }
  else if(item instanceof Object && !(item instanceof Function)){ 
    result = {};
    for(let key in item){
      if(key){
        result[key] = copy(item[key]);
      }
    }
  }
  return result || item;
}

Mais le meilleur moyen est de créer une classe qui peut renvoyer un clone de son propre corps.

class MyClass{
    data = null;
    constructor(values){ this.data = values }
    toString(){ console.log("MyClass: "+this.data.toString(;) }
    remove(id){ this.data = data.filter(d=>d.id!==id) }
    clone(){ return new MyClass(this.data) }
}