Cópia profunda de um objeto em JavaScript usando estruturadoClone

Se você está aqui, aposto que já usou JSON.parse()+ JSON.stringify()truque centenas de vezes para criar uma cópia profunda de um objeto em JavaScript. Você não precisa mais disso, o nativo structuredClone()está aqui para te ajudar.

Cópia rasa x cópia profunda

Antes de tudo, vamos lembrar qual é a diferença entre uma Shallow Copy e uma Deep Copy:

• Cópia rasa: significa que apenas o primeiro nível do objeto é copiado . Níveis mais profundos são referenciados. Você pode conseguir isso em JavaScript usando o operador Spread ( …) ou usando Object.assign().
• Deep copy: significa que todos os níveis do objeto são copiados . Esta é uma cópia verdadeira do objeto. Você pode fazer isso usando JSON.parse()+ JSON.stringify(), e agora também pode fazer com o nativo structuredClone().

Deep Copy usando estruturadoClone

O método global structuredClone()cria uma cópia profunda de um determinado valor usando o algoritmo de clone estruturado .

Como você pode ver neste trecho de código:

• Após atualizar uma propriedade no primeiro nível dos objetos clonados, a propriedade original não é atualizada .
• Depois de atualizar uma propriedade em um nível mais profundo, a propriedade original não é atualizada . Isso acontece porque, nesse caso, níveis mais profundos também são copiados.

Codificação feliz!