Freeze vs de congelación profunda en JavaScript

En JavaScript, los enfoques de congelación y congelación profundos hacen que un objeto sea inmutable/no modificable. Pero, ¿por qué alguien debería usar congelamiento superficial o congelación profunda?? Bien! En JavaScript, todo es un objeto, y todos sabemos que los objetos en JavaScript son mutables (modificables). Pero, ¿qué pasa si alguien quiere hacer que los objetos sean inmutables (no modificables)?

Hay múltiples formas de hacer que un objeto sea inmutable, como usar la palabra clave "const", congelación superficial y congelación profunda.

Este artículo tiene como objetivo presentar una comprensión clara de los siguientes conceptos:

• ¿Cuál es la necesidad de congelación superficial??
• ¿Qué significa la congelación superficial en JavaScript??
• ¿Cuál es la necesidad de una congelación profunda en JavaScript??
• ¿Qué significa la congelación profunda en JavaScript??
• Implementación práctica de la congelación profunda en JavaScript.

Comprenderemos cada uno de los conceptos mencionados anteriormente a través de ejemplos prácticos. Entonces empecemos!

¿Cuál es la necesidad de una congelación superficial??

Las razones que cotizan en cuenta nos obligan a implementar la congelación superficial o la congelación profunda:

• Todo gira en torno a los objetos en JavaScript.
• Los objetos en JavaScript son mutables (modificables).
• Una forma de hacer que un objeto sea inmutable es usar la palabra clave "const".
• Un objeto declarado con la palabra clave "const" no se puede modificar/reasignar. Sin embargo, sus propiedades se pueden modificar/reasignar.
• Entonces, ¿qué pasa si alguien quiere bloquear/congelar un objeto por completo??
• Bien! El concepto de congelación superficial se puede usar en tales casos.

Ejemplo: identificación de problemas

Este programa identificará por qué "estúpido"La palabra clave no es un buen enfoque para hacer que los objetos sean inmutables.

const empdetails = Primero: "Alex", segundo: "John", tercero: "Mike", cuarto: "Joe", quinto: "Seth";
consola.log ("Valores de objeto originales:", empdetails);
cola de empdeta.tercero = "Ambrose";
consola.log ("Valores de objeto modificados:", EmpDetails);

• En primer lugar, creamos un objeto usando la palabra clave "const" y la asignamos algunos pares de valor clave.
• A continuación, imprimimos los valores originales del objeto.
• Después, modificamos el valor de la "tercera" clave.
• Finalmente, imprimimos los valores de objeto modificados usando la "Consola.registro()".

La salida verificó que la palabra clave "const" no pudo evitar que un objeto se modifique. El enfoque de congelación superficial se puede usar para resolver/solucionar este problema.

¿Qué significa la congelación superficial en JavaScript??

El objeto.El método congele () puede congelar completamente un objeto. El objeto.El método congele () restringe a un usuario que agregue, elimine o modifique el objeto. Además, restringe a los usuarios acceder a los métodos/propiedades existentes de un objeto.

Ejemplo: Implementación del objeto.método congele ()
Consideremos el código dado a continuación para obtener una comprensión básica del objeto.Método Freeze ():

const empdetails = Primero: "Alex", segundo: "John", tercero: "Mike", cuarto: "Joe", quinto: "Seth";
consola.log ("Valores de objeto originales:", empdetails);
Objeto.congelar (empdetails);
cola de empdeta.tercero = "Ambrose";
eliminar las colas empdetas;
consola.log ("Valores de objeto modificados:", EmpDetails);

• Usamos el objeto.Método congele () para congelar el objeto "Empdetails".
• A continuación, imprimimos los valores originales del objeto "Empdetails".
• Posteriormente, intentamos actualizar la propiedad "tercera" del objeto "EmpDetails" ..
• A continuación, utilizamos el operador de eliminación para eliminar la propiedad "tercera".
• Finalmente, imprimimos los "valores de objeto modificados" usando la consola.Método log ().

La salida aclaró que el objeto.El método congele () no permite modificaciones al objeto.

¿Cuál es la necesidad de la congelación profunda en JavaScript??

El ejemplo anterior muestra que el enfoque de congelación poco profunda evita que el objeto modifique. Aún así, no se considera el mejor enfoque. Esto se debe a que el enfoque de congelación superficial solo congela el objeto dado. Sin embargo, si el objeto contiene algunos objetos o matrices anidados, entonces en tales situaciones, los objetos anidados aún se pueden actualizar.

Entonces, cómo lidiar con objetos anidados? Bien! En tal caso, podemos usar el concepto de congelación profunda.

¿Qué significa la congelación profunda en JavaScript??

Debe seguir los pasos de la lista a continuación para aplicar la congelación profunda a un objeto:

• Tenemos que congelar cada propiedad recursivamente.
• Para hacer eso, en primer lugar, verifique si el valor de cualquier propiedad es un objeto o no.
• Si el valor de cualquier propiedad es un objeto, verifique si está congelado.
• Si el valor de cualquier propiedad es un objeto y aún no está congelado, entonces invoque el método de congelación en esa propiedad recursivamente.
• De esta manera, puedes crear un objeto inmutable.

Implementación práctica de la congelación profunda en JavaScript

El programa a continuación le permitirá comprender cómo congelar un objeto en JavaScript:

const empdetails =
Primero: "Alex",
Segundo: "John",
Tercero: "Mike",
Cuarto: ["Joe", "Dean"],
Quinto: "Seth"
;
const profunf = (empdetails) =>
Objeto.Cayos (Empdetails).foreach ((objProp) =>
si (
typeof empdetails [objprop] === "objeto" &&
!Objeto.Isfrozen (Empdetails [objprop])
)
profundo (empdetails [objProp]);
);
Objeto de retorno.congelar (empdetails);
;
profundo (empdetails);
consola.log ("Valores de objeto originales:", empdetails);
Objeto.congelar (empdetails);
cola de empdeta.cuarto [0] = "Ambrose";
consola.log ("Valores de objeto modificados:", EmpDetails);

En este programa, adoptamos el enfoque recursivo para congelar la propiedad de cada objeto. Para hacerlo, inicialmente, verificamos si el valor de cualquier propiedad es un objeto o no. Cuando encontramos que una propiedad es un objeto, verificamos si está congelado o no. Si el valor de cualquier propiedad es un objeto y aún no está congelado, entonces invocamos el objeto.método congele () en esa propiedad recursivamente.

De la salida dada anteriormente, está claro que el enfoque de congelación profunda evita que el objeto se modifique.

Conclusión

En JavaScript, los enfoques de congelación y congelación profundos hacen que un objeto sea inmutable/no modificable. La diferencia entre congelación poco profunda y congelación profunda es que la congelación poco profunda no se ocupa de los objetos/matrices anidados. Por otro lado, el enfoque de congelación profunda se puede usar para congelar un objeto por completo que incluye los objetos/matrices anidados. Este artículo explicó el funcionamiento de la congelación superficial y la congelación profunda con la ayuda de ejemplos adecuados.