Felipe Kautzmann

Deep clone com JavaScript structuredClone()

A função structuredClone é uma funcionalidade do HTML5 que foi introduzida pela primeira vez em outubro de 2014. É parte da API postMessage, que permite uma comunicação segura entre diferentes documentos ou contextos de navegação.

Essa função proporciona uma forma rápida, segura e eficiente de copiar objetos. Ela é muito útil quando precisamos fazer uma cópia profunda (deep copy) de um objeto, sem precisar se preocupar com referências circulares (circular references).

Com isso todos os valores dentro do objeto original são copiados para o novo objeto, incluindo objetos aninhados. Isso é diferente de uma cópia superficial (shallow copy), que só copia as referências para os objetos aninhados e não os valores em si.

Para usar a função structuredClone, você simplesmente passa o objeto que deseja copiar como argumento. Por exemplo, aqui está um exemplo de como copiar um objeto simples:

let originalObject = {a: 1, b: 2, c: {d: 3, e: 4}};
let copiedObject = structuredClone(originalObject);

console.log(copiedObject); // {a: 1, b: 2, c: {d: 3, e: 4}}

É importante notar que a função structuredClone só pode ser usada em navegadores modernos, e não está disponível em todas as implementações do JavaScript.

Além disso, existem algumas restrições sobre quais tipos de objetos podem ser copiados com esta função, incluindo objetos com funções e objetos de tipos específicos como File e ImageData.

No entanto, se você precisar fazer cópias profundas de objetos em JavaScript e estiver trabalhando em um navegador moderno, a função structuredClone pode ser uma excelente escolha.

Até a próxima!

Voltar