Grunt frys vs dypfrysing i javascript

Grunt frys vs dypfrysing i javascript
I JavaScript gjør de grunne fryse- og dype tilnærminger til et objekt uforanderlig/ikke-modifiserbar. Men hvorfor skal noen bruke grunne frys eller fryse? Vi vil! I JavaScript er alt et objekt, og vi vet alle at objektene i JavaScript er mutable (modifiserbare). Men hva hvis noen vil gjøre gjenstander uforanderlige (ikke-modifiserbare)?

Det er flere måter å gjøre et objekt uforanderlig, for eksempel å bruke "const" nøkkelord, grunt frysing og dyp frysing.

Denne oppskrivningen tar sikte på å presentere en klar forståelse av følgende konsepter:

  • Hva er behovet for grunt frysing?
  • Hva betyr grunt frysing i JavaScript?
  • Hva er behovet for dyp frysing i JavaScript?
  • Hva betyr dypfrysing i JavaScript?
  • Praktisk implementering av Deep Freeze i JavaScript.

Vi vil forstå hvert av konseptene som er nevnt ovenfor gjennom praktiske eksempler. Så la oss komme i gang!

Hva er behovet for en grunt frysing?

De nedenfor-børsnoterte grunnene tvinger oss til å implementere den grunne frysingen eller dypfrysingen:

  • Alt dreier seg om gjenstandene i JavaScript.
  • Objekter i JavaScript er mutable (modifiserbare).
  • En måte å gjøre et objekt uforanderlig på er å bruke nøkkelordet “const”.
  • Et objekt som er erklært med "const" nøkkelordet kan ikke endres/tildeles omfordeles. Imidlertid kan egenskapene endres/tildeles omfordeles.
  • Så hva om noen vil låse/fryse et objekt helt?
  • Vi vil! Konseptet med grunt frys kan brukes i slike tilfeller.

Eksempel: Problemidentifikasjon

Dette programmet vil identifisere hvorfor “const”Nøkkelord er ikke en god tilnærming for å gjøre objekter uforanderlig.

const empdetails = først: "Alex", andre: "John", tredje: "Mike", fjerde: "Joe", femte: "seth";
konsoll.logg ("Original objektverdier:", empdetails);
Empdetails.tredje = "Ambrose";
konsoll.Logg ("Modifiserte objektverdier:", Empdetails);
  • For det første opprettet vi et objekt ved hjelp av "const" nøkkelord og tildelte det noen nøkkelverdipar.
  • Deretter trykket vi de opprinnelige verdiene til objektet.
  • Etterpå endret vi verdien av den "tredje" tasten.
  • Til slutt trykket vi de modifiserte objektverdiene ved hjelp av “konsollen.Logg()".

Utgangen bekreftet at "const" -nøkkelordet ikke klarte å forhindre at et objekt ble endret. Den grunne frysetilnærmingen kan brukes til å løse/fikse dette problemet.

Hva betyr grunt frysing i JavaScript?

Objektet.Frys () -metoden kan fryse et objekt fullstendig. Objektet.Frys () -metoden begrenser en bruker fra å legge til, slette eller endre objektet. Videre begrenser det brukerne fra å få tilgang til et objekts eksisterende metoder/egenskaper.

Eksempel: Implementering av objekt.Frys () -metode
La oss vurdere den undergitte koden for å få en grunnleggende forståelse av objektet.Frys () Metode:

const empdetails = først: "Alex", andre: "John", tredje: "Mike", fjerde: "Joe", femte: "seth";
konsoll.logg ("Original objektverdier:", empdetails);
Gjenstand.fryse (empdetails);
Empdetails.tredje = "Ambrose";
slette empdetails;
konsoll.Logg ("Modifiserte objektverdier:", Empdetails);
  • Vi brukte objektet.Frys () Metode for å fryse “EmpDetails” -objektet.
  • Deretter trykket vi de opprinnelige verdiene til objektet “Empdetails”.
  • Etterpå prøvde vi å oppdatere "tredje" egenskapen til "EmpDetails" -objektet ..
  • Deretter benyttet vi slettoperatøren til å slette egenskapen "tredje".
  • Til slutt trykte vi både de "modifiserte objektverdiene" ved hjelp av konsollen.Log () Metode.

Utgangen avklarte at objektet.Frys () -metoden tillater ikke endringer i objektet.

Hva er behovet for dypfrysingen i JavaScript?

Eksemplet ovenfor viser at den grunne frysetilnærmingen vellykket forhindrer at objektet endrer seg. Likevel regnes det ikke som den beste tilnærmingen. Dette er fordi den grunne frysetilnærmingen bare fryser det gitte objektet. Imidlertid, hvis objektet inneholder noen nestede objekter eller matriser, kan de fortsatt oppdateres i slike situasjoner.

Så hvordan du skal takle nestede gjenstander? Vi vil! I et slikt tilfelle kan vi bruke begrepet dypfrysing.

Hva betyr dypfrysing i JavaScript?

Du må følge trinnene nedenfor for å påføre den dype frysen på et objekt:

  • Vi må fryse hver eiendom rekursivt.
  • For å gjøre det for det første, sjekk om verdien av noen egenskap er et objekt eller ikke.
  • Hvis verdien av noen egenskap er et objekt, må du sjekke om den er frosset.
  • Hvis verdien av noen egenskap er et objekt og fremdeles ikke er frosset, må du påkalle frysmetoden på den egenskapen rekursivt.
  • På denne måten kan du lage et uforanderlig objekt.

Praktisk implementering av Deep Freeze i JavaScript

Det undergitte programmet lar deg forstå hvordan du kan fryse et objekt i JavaScript:

const empdetails =
Først: "Alex",
For det andre: "John",
Tredje: "Mike",
Fjerde: ["Joe", "Dean"],
Femte: "Seth"
;
const deepf = (empdetails) =>
Gjenstand.Keys (EmpDetails).foreach ((objProp) =>
hvis (
typeof empdetails [objprop] === "objekt" &&
!Gjenstand.IsFrozen (EmpDetails [ObjProp])
)
Deepf (EmpDetails [objProp]);
);
Returobjekt.fryse (empdetails);
;
Deepf (empdetails);
konsoll.logg ("Original objektverdier:", empdetails);
Gjenstand.fryse (empdetails);
Empdetails.Fjerde [0] = "Ambrose";
konsoll.Logg ("Modifiserte objektverdier:", Empdetails);

I dette programmet vedtok vi den rekursive tilnærmingen for å fryse hver gjenstands eiendom. For å gjøre det, sjekket vi til å begynne med om verdien av noen eiendommer er et objekt eller ikke. Da vi fant ut at en eiendom er et objekt, så sjekket vi om den er frosset eller ikke. Hvis verdien av noen egenskap er et objekt og fremdeles ikke er frosset, påkaller vi objektet.Frys () -metode på den egenskapen rekursivt.

Fra ovennevnte utgang er det klart at den dype frysetilnærmingen forhindrer at objektet blir endret.

Konklusjon

I JavaScript gjør de grunne fryse- og dype tilnærminger til et objekt uforanderlig/ikke-modifiserbar. Forskjellen mellom grunt frysing og dyp frysing er at den grunne frysen ikke tar for seg de nestede objektene/matriser. På den annen side kan den dype frysetilnærmingen brukes til å fryse et objekt fullstendig inkludert de nestede objektene/matriser. Denne oppskrivningen forklarte arbeidet med grunne frys og dypfrysing ved hjelp av passende eksempler.