Neste artigo você vai aprender como clonar um objeto em JavaScript – um conceito também chamado de deep clone, utilizando JS puro!
Fala programador(a), beleza? Bora ver como se clona um objeto em JavaScript, da maneira mais rápida e também com performance!
A forma mais simples e eficaz para realizar esta ação com JS puro, e compatível com navegadores, ou seja, ES5 para baixo
É convertendo o objeto em uma string e depois em JSON, tudo utilizando o objeto JSON do JavaScript
Veja na prática:
let obj = {
nome: 'Matheus'
}
let obj2 = JSON.parse(JSON.stringify(obj));
console.log(obj2);Dessa forma o objeto será clonado e você poderá utilizar todas as suas propriedades e métodos existentes no objeto original
Clonando com ES6
Caso não haja problema na versão do JavaScript, ou seja, você faz transpile do código
Já pode utilizar uma sintaxe que veio com o ES6, utilizando o método assign de Objet
Veja também na prática:
let obj = {
nome: 'Matheus'
}
let obj2 = Object.assign({}, obj);
console.log(obj2);Sintaxe mais simples e também parece menos gambiarra, não é? 😀
Porém tome cuidado com os navegadores mais desatualizados, o assing pode não funcionar!
Conclusão
Neste artigo vimos como clonar um objeto em JavaScript, utilizando formas tanto no ES6 como também no ES6
É bom ficar atento a versão dos navegadores que o projeto tem que suportar, pois o assign pode não funcionar nos browsers mais antigos
Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube