Freeze peu profonde vs Freeze Deep en Javascript

En JavaScript, les approches de gel et de gel profond peu profondes rendent un objet immuable / non modifiable. Mais pourquoi quelqu'un devrait-il utiliser un gel peu profond ou un gel profond? Bien! En JavaScript, tout est un objet, et nous savons tous que les objets en javascript sont mutables (modifiables). Mais que se passe-t-il si quelqu'un veut rendre les objets immuables (non modifiables)?

Il existe plusieurs façons de rendre un objet immuable, comme l'utilisation du mot-clé «const», du gel peu profond et du gel profond.

Cette rédaction vise à présenter une compréhension claire des concepts suivants:

• Quel est le besoin de gel peu profond?
• Que signifie le gel peu profond en javascript?
• Quel est le besoin d'un gel profond en javascript?
• Que signifie Deep Freeze en JavaScript?
• Mise en œuvre pratique du gel profond en javascript.

Nous comprendrons chacun des concepts mentionnés ci-dessus à travers des exemples pratiques. Alors, commençons!

Quelle est la nécessité d'un gel peu profond?

Les raisons ci-dessous nous obligent à mettre en œuvre le gel peu profond ou le gel profond:

• Tout tourne autour des objets en javascript.
• Les objets en JavaScript sont mutables (modifiables).
• Une façon de rendre un objet immuable est d'utiliser le mot-clé «const».
• Un objet déclaré avec le mot clé «const» ne peut pas être modifié / réaffecté. Cependant, ses propriétés peuvent être modifiées / réaffectées.
• Alors, et si quelqu'un veut verrouiller / geler complètement un objet?
• Bien! Le concept de gel peu profond peut être utilisé dans de tels cas.

Exemple: identification des problèmes

Ce programme identifiera pourquoi le «const»Le mot-clé n'est pas une bonne approche pour rendre les objets immuables.

Const empretails = premier: "Alex", deuxième: "John", troisième: "Mike", quatrième: "Joe", cinquième: "Seth";
console.log ("Valeurs d'objets d'origine:", empDetails);
empdetails.Troisième = "Ambrose";
console.log ("Valeurs d'objets modifiés:", empDetails);

• Premièrement, nous avons créé un objet en utilisant un mot-clé «const» et lui avons attribué quelques paires de valeurs de clé.
• Ensuite, nous avons imprimé les valeurs d'origine de l'objet.
• Par la suite, nous avons modifié la valeur de la «troisième» clé.
• Enfin, nous avons imprimé les valeurs d'objet modifiées en utilisant la «console.enregistrer()".

La sortie a vérifié que le mot clé «const» n'a pas empêché un objet d'être modifié. L'approche de gel peu profond peut être utilisée pour résoudre / résoudre ce problème.

Que signifie le gel peu profond en javascript?

L'object.La méthode Freeze () peut geler complètement un objet. L'object.La méthode Freeze () empêche un utilisateur d'ajouter, de supprimer ou de modifier l'objet. De plus, il empêche les utilisateurs d'accéder aux méthodes / propriétés existantes d'un objet.

Exemple: implémentation de l'objet.Méthode Freeze ()
Prenons le code ci-dessous pour obtenir une compréhension de base de l'objet.Méthode Freeze ():

Const empretails = premier: "Alex", deuxième: "John", troisième: "Mike", quatrième: "Joe", cinquième: "Seth";
console.log ("Valeurs d'objets d'origine:", empDetails);
Objet.gel (empdetails);
empdetails.Troisième = "Ambrose";
Supprimer des Empdetails;
console.log ("Valeurs d'objets modifiés:", empDetails);

• Nous avons utilisé l'objet.Freeze () Méthode pour geler l'objet "empdetails".
• Ensuite, nous avons imprimé les valeurs d'origine de l'objet «Empdetails».
• Par la suite, nous avons essayé de mettre à jour la «troisième» propriété de l'objet «Empdetails»…
• Ensuite, nous avons utilisé l'opérateur de suppression pour supprimer la «troisième» propriété.
• Enfin, nous avons imprimé à la fois les «valeurs d'objet modifiées» à l'aide de la console.Méthode log ().

La sortie a précisé que l'objet.La méthode Freeze () n'autorise pas les modifications à l'objet.

Quel est le besoin du gel profond en javascript?

L'exemple ci-dessus montre que l'approche de gel superficiel empêche avec succès l'objet de modifier. Pourtant, ce n'est pas considéré comme la meilleure approche. En effet. Cependant, si l'objet contient des objets ou des tableaux imbriqués, alors dans de telles situations, les objets imbriqués peuvent toujours être mis à jour.

Alors, comment gérer les objets imbriqués? Bien! Dans un tel cas, nous pouvons utiliser le concept du gel profond.

Que signifie Deep Freeze en JavaScript?

Vous devez suivre les étapes ci-dessous pour appliquer le gel profond à un objet:

• Nous devons congeler chaque propriété récursivement.
• Pour ce faire, premièrement, vérifiez si la valeur d'une propriété est un objet ou non.
• Si la valeur d'une propriété est un objet, vérifiez s'il est gelé.
• Si la valeur d'une propriété est un objet et qu'il n'est toujours pas gelé, invoquez la méthode de gel sur cette propriété récursive.
• De cette façon, vous pouvez créer un objet immuable.

Mise en œuvre pratique du gel profond en javascript

Le programme donné ci-dessous vous permettra de comprendre comment geler profondément un objet en javascript:

const empretails =
Premièrement: "Alex",
Deuxièmement: "John",
Troisièmement: "Mike",
Quatrième: ["Joe", "Dean"],
cinquième: "Seth"
;
const deepf = (empDetails) =>
Objet.Clés (empdetails).foreach ((objprop) =>
si (
Typeof EmpDetails [objprop] === "Object" &&
!Objet.isfrozen (empdetails [objprop])
)
Deepf (empDetails [objprop]);
);
objet de retour.gel (empdetails);
;
Deepf (empdetails);
console.log ("Valeurs d'objets d'origine:", empDetails);
Objet.gel (empdetails);
empdetails.quatrième [0] = "Ambrose";
console.log ("Valeurs d'objets modifiés:", empDetails);

Dans ce programme, nous avons adopté l'approche récursive pour geler la propriété de chaque objet. Pour ce faire, initialement, nous avons vérifié si la valeur d'une propriété est un objet ou non. Lorsque nous avons constaté qu'une propriété est un objet, alors nous avons vérifié s'il était gelé ou non. Si la valeur d'une propriété est un objet et qu'il n'est toujours pas gelé, alors nous invoquons l'objet.Freeze () Méthode sur cette propriété récursive.

À partir de la sortie ci-dessus, il est clair que l'approche de gel profond empêche l'objet d'être modifié.

Conclusion

En JavaScript, les approches de gel et de gel profond peu profondes rendent un objet immuable / non modifiable. La différence entre le gel peu profond et le gel profond est que le gel peu profond ne traite pas des objets / tableaux imbriqués. D'un autre côté, l'approche de gel profondément peut être utilisée pour geler un objet complètement incluant les objets / tableaux imbriqués. Cet article a expliqué le fonctionnement du gel peu profond et du gel profond à l'aide d'exemples appropriés.