Płytkie zamrażanie vs głębokie zamrażanie w JavaScript

Płytkie zamrażanie vs głębokie zamrażanie w JavaScript
W JavaScript płytkie podejścia zamrażania i głębokie zamrożenie sprawiają, że obiekt jest niezmienny/nie-modyfikowalny. Ale dlaczego ktoś miałby używać płytkiego zamrożenia lub głębokiego zamrożenia? Dobrze! W JavaScript wszystko jest obiektem i wszyscy wiemy, że obiekty w JavaScript są zmienne (modyfikowalne). Ale co, jeśli ktoś chce uczynić obiektami niezmiennymi (nie do zmodyfikowania)?

Istnieje wiele sposobów uczynienia obiektu niezmiennego, na przykład używanie słowa kluczowego „const”, płytkie zamrożenie i głębokie zamrażanie.

Ten zapis ma jasne zrozumienie następujących pojęć:

  • Jaka jest potrzeba płytkiego zamrożenia?
  • Co oznacza płytka zamrożenie w JavaScript?
  • Jaka jest potrzeba głębokiego zamrażania w JavaScript?
  • Co oznacza głębokie zamrożenie w JavaScript?
  • Praktyczne wdrożenie głębokiego zamrożenia w JavaScript.

Zrozumiemy każdą z wyżej wymienionych pojęć poprzez praktyczne przykłady. Więc zacznijmy!

Jaka jest potrzeba płytkiego zamrożenia?

Poniższe powody zmuszają nas do wdrożenia płytkiego zamrożenia lub głębokiego zamrożenia:

  • Wszystko obraca się wokół obiektów w JavaScript.
  • Obiekty w JavaScript są zmienne (możliwe do modyfikowania).
  • Jednym ze sposobów utworzenia obiektu niezmiennego jest użycie słowa kluczowego „const”.
  • Obiekt zadeklarowany słowem kluczowym „const” nie może być modyfikowane/przeniesione. Jednak jego właściwości można zmodyfikować/przenieść.
  • A co, jeśli ktoś chce całkowicie zablokować/zamrozić obiekt?
  • Dobrze! W takich przypadkach można zastosować pojęcie płytkiego zamrożenia.

Przykład: Identyfikacja problemu

Ten program określi, dlaczego „const”Słowo kluczowe nie jest dobrym podejściem do uczynienia obiektów niezmiennymi.

const empDetails = First: „Alex”, drugi: „John”, trzeci: „Mike”, czwarty: „Joe”, Fifth: „Seth”;
konsola.log („oryginalne wartości obiektu:”, empDetails);
Empdetails.trzecie = „ambrose”;
konsola.log („Zmodyfikowane wartości obiektu:”, empDetails);
  • Po pierwsze, utworzyliśmy obiekt za pomocą słowa kluczowego „const” i przypisaliśmy mu niektóre pary wartości kluczy.
  • Następnie wydrukowaliśmy oryginalne wartości obiektu.
  • Następnie zmodyfikowaliśmy wartość klucza „trzeciego”.
  • Na koniec wydrukowaliśmy zmodyfikowane wartości obiektów za pomocą „konsoli.dziennik()".

Wyjście zweryfikowało, że słowo kluczowe „const” nie zapobiegło modyfikacji obiektu. Do rozwiązania/rozwiązania tego problemu można zastosować płytkie podejście do zamrażania.

Co oznacza płytka zamrożenie w JavaScript?

Obiekt.Metoda freeze () może całkowicie zamrozić obiekt. Obiekt.Freeze () Metoda ogranicza użytkownika do dodawania, usuwania lub modyfikowania obiektu. Ponadto ogranicza użytkownikom dostęp do istniejących metod/właściwości obiektu.

Przykład: Implementacja obiektu.Metoda Freeze ()
Rozważmy poniżej przekazany kod, aby uzyskać podstawowe zrozumienie obiektu.Freeze () Metoda:

const empDetails = First: „Alex”, drugi: „John”, trzeci: „Mike”, czwarty: „Joe”, Fifth: „Seth”;
konsola.log („oryginalne wartości obiektu:”, empDetails);
Obiekt.Freeze (empdetails);
Empdetails.trzecie = „ambrose”;
usunąć empdetails;
konsola.log („Zmodyfikowane wartości obiektu:”, empDetails);
  • Użyliśmy obiektu.Freeze () Metoda zamrożenia obiektu „empDetail”.
  • Następnie wydrukowaliśmy oryginalne wartości obiektu „empDetail”.
  • Następnie próbowaliśmy zaktualizować „trzecią” właściwość obiektu „empDetail”…
  • Następnie wykorzystaliśmy operatora Usuń do usunięcia „trzeciej” właściwości.
  • Na koniec wydrukowaliśmy zarówno „zmodyfikowane wartości obiektów” za pomocą konsoli.Metoda log ().

Wyjście wyjaśniło, że obiekt.Metoda freeze () nie zezwala na modyfikacje obiektu.

Jaka jest potrzeba głębokiego zamrażania w JavaScript?

Powyższy przykład pokazuje, że podejście płytkiego zamrażania z powodzeniem zapobiega modyfikowaniu obiektu. Mimo to nie jest to uważane za najlepsze podejście. Wynika to z faktu, że podejście płytkiego zamrażania zamraża tylko dany obiekt. Jeśli jednak obiekt zawiera niektóre zagnieżdżone obiekty lub tablice, to w takich sytuacjach zagnieżdżone obiekty mogą być nadal aktualizowane.

Jak więc radzić sobie z zagnieżdżonymi przedmiotami? Dobrze! W takim przypadku możemy użyć koncepcji głębokiego zamrożenia.

Co oznacza głębokie zamrożenie w JavaScript?

Musisz wykonać kroki poniżej na liście, aby zastosować głębokie zamrożenie do obiektu:

  • Musimy zamrozić każdą nieruchomość rekurencyjnie.
  • Aby to zrobić, po pierwsze, sprawdź, czy wartość dowolnej właściwości jest obiektem, czy nie.
  • Jeśli wartość dowolnej właściwości jest obiektem, sprawdź, czy jest zamrożona.
  • Jeśli wartość dowolnej właściwości jest obiektem i nadal nie jest zamrożona, przywołaj metodę zamrażania tej właściwości.
  • W ten sposób możesz utworzyć niezmienny obiekt.

Praktyczne wdrożenie głębokiego zamrożenia w JavaScript

Poniższy program pozwoli ci zrozumieć, jak głęboko zamrozić obiekt w JavaScript:

const empdetails =
Po pierwsze: „Alex”,
Po drugie: „John”,
Po trzecie: „Mike”,
Czwarty: [„Joe”, „Dean”],
Piąty: „Seth”
;
const deepf = (empDetails) =>
Obiekt.klucze (empdetails).foreach ((objprop) =>
Jeśli (
TypeOF EmpDetails [objprop] === „Object” &&
!Obiekt.isfrozen (empdetails [objprop])
)
Deepf (empdetails [objprop]);
);
Obiekt powrotu.Freeze (empdetails);
;
Deepf (empdetails);
konsola.log („oryginalne wartości obiektu:”, empDetails);
Obiekt.Freeze (empdetails);
Empdetails.czwarty [0] = „Ambrose”;
konsola.log („Zmodyfikowane wartości obiektu:”, empDetails);

W tym programie przyjęliśmy rekurencyjne podejście do zamrażania własności każdego obiektu. Aby to zrobić, początkowo sprawdziliśmy, czy wartość dowolnej właściwości jest obiektem, czy nie. Kiedy stwierdziliśmy, że właściwość jest obiektem, sprawdziliśmy, czy jest zamrożona, czy nie. Jeśli wartość dowolnej właściwości jest obiektem i nadal nie jest zamrożona, wówczas wywołujemy obiekt.Freeze () Metoda tej właściwości rekurencyjnie.

Z powyższego wyjścia jasno wynika, że ​​podejście głębokiego zamrażania zapobiega modyfikowaniu obiektu.

Wniosek

W JavaScript płytkie podejścia zamrażania i głębokie zamrożenie sprawiają, że obiekt jest niezmienny/nie-modyfikowalny. Różnica między płytkim zamrożeniem a głębokim zamrożeniem polega na tym, że płytkie zamrażanie nie dotyczy zagnieżdżonych obiektów/tablic. Z drugiej strony podejście głębokiego zamrażania można użyć do całkowitego zamrożenia obiektu, w tym zagnieżdżonych obiektów/tablic. Ten zapis wyjaśnił działanie płytkiego zamrożenia i głębokiego zamrożenia za pomocą odpowiednich przykładów.