¿Cómo hacer una clonación profunda en JavaScript?

En general, clonar significa copiar un valor a otro. En JavaScript, clonamos, es decir, copiamos un valor a otro usando JavaScript. Para ser más precisos son dos tipos de clonación en JavaScript. Como programador, puede ser un principiante o un veterano que debería poder conocer las diferencias entre el clon profundo y el clon superficial. Como este artículo trata sobre los clones profundos, estudiaremos los detalles sobre los clones profundos. La clonación es un concepto que puede ocurrir en cualquier tipo de datos, es decir, podría ser un tipo de datos primitivo (como string, número) o tipos de datos compuestos como arrays y JavaScript. Entonces, para dominarlo, debemos ser claros con la base.
Deep Clone: ​​Deep clone es una técnica que se utiliza para duplicar todo cuando estamos clonando arrays, JavaScript para evitar la pérdida de datos.

Ejemplo 1: Como en este ejemplo, los datos se corrompen si cambiamos el valor de un objeto, entonces se refleja en otros objetos y esa es la razón para evitar este problema que usamos Deep Clone.

<script>
    var student1 ={
        name : "Manish",
        company : "Gfg"
 
    }
 
    var student2 =  student1  ;
 
    student1.name = "Rakesh"
     
    console.log("student 1 name is",student1.name)
    console.log("student 2 name is ",student2.name);
</script>

Producción:

Ejemplo 2: uso del operador de propagación

<script>
    var student1 ={ 
    name : "Manish",
    company : "Gfg"
 
    }
 
    var student2 =  { ...student1 } ;
 
    student1.name = "Rakesh"
 
    console.log("student 1 name is",student1.name)
    console.log("student 2 name is ",student2.name);
</script>

Producción:
 

Ejemplo 3: Uso de Object.assign()

<script>
    var student1 ={
    name : "Manish",
    company : "Gfg"
    }
 
    var student2 = Object.assign( {} ,student1) ;
 
    student1.name = "Rakesh"
 
    console.log("student 1 name is",student1.name)
    console.log("student 2 name is ",student2.name);
</script>

Producción:

Ejemplo 4: uso de Json.parse y Json.stringify

<script>
    var student1 ={
    name : "Manish",
    company : "Gfg"
 
    }
 
    var student2 = JSON.parse(JSON.stringify(student1))
 
    student1.name = "Rakesh"
 
    console.log("student 1 name is",student1.name)
    console.log("student 2 name is ",student2.name);
</script>

Producción:

Conclusión: podemos usar todos estos enfoques para asegurarnos de que los datos estén seguros y no muten cuando cambiamos un objeto.