Você alguma vez já pode ter se deparado com uma situação bem esquisita, onde você utiliza duas variáveis, modifica o valor de uma delas, e a segunda também se modifica, como neste caso:
// Objeto
var a = { nome: 'Carlito', idade: 22 };
var b = a;
b.nome = 'Fabio';
console.log(b);
// {nome:'Fabio',idade:22}
console.log(a);
// {nome:'Fabio',idade:22}Como você pode ver, ao modificar a objeto b no qual foi inserido o objeto a, a também foi modificado.
Existe pouca informação sobre isso, mas é uma situação bem comum pra quem trabalha com javascript à muito tempo.
Acontece é que o Javascript aloca objetos e matrizes na memória por referencia do objeto ou matriz original, e não por valor.
Objetos
Temos 3 maneiras de clonar objetos:
const body = { mouth: '👅', eyes: '👀' }
// ES6 : Spread Operator
const cloneBody = { ...body }
// Object.assign
const cloneBody = Object.assign({}, body)
// JSON
const cloneBody = JSON.parse(JSON.stringify(body))
No final das contas, qualquer forma de atribuição onde se quebra e constrói novamente o valor, o resultado será um clone do valor porém sem referencia.
Arrays
No caso de arrays, temos 2 maneiras simples:
const actors = ['Matthew','Anne','Robert'];
// < ES6
const cloneActors = actors.slice();
// ES6 > Spread Operator
const cloneActors = [...actors];
// Outra forma interessante
const cloneActors = Array.from(actors);
Profundidade
No caso da solução com o Spread Operator, note que ele apenas clona a nível de superfície, ou seja, apenas um nível de profundidade do array.
const arrays = [[1, 2], [10]];
const cloneArrays = [...arrays];
// Mudamos o valor do primeiro item no primeiro array aninhado do nosso array clonado.
cloneArrays[0][0] = '👻';
console.log(cloneArrays);
// [ [ '👻', 2 ], [ 10 ], [ 300 ] ]
// Note que o array original também foi afetado
console.log(arrays);
// [ [ '👻', 2 ], [ 10 ], [ 300 ] ]
Então ao escolher essa solução, analise os valores no qual estiver trabalhando.