JavaScriptలో Shallow Copy vs Deep Copy

డేటా రకాన్ని బట్టి JavaScript కాపీయింగ్‌ను రెండు విధాలుగా నిర్వహిస్తుంది.

Primitive Values (Copy by Value) Primitive రకాల్లో strings, numbers, booleans, symbols, bigInt, మరియు null ఉంటాయి. మీరు ఒక primitive ని కాపీ చేసినప్పుడు, JavaScript మెమరీలో ఒక కొత్త స్వతంత్ర వెర్షన్‌ను సృష్టిస్తుంది.

Example:

let a = 10;
let b = a;
b = 20;

Result: a విలువ 10 గానే ఉంటుంది.

Non-Primitive Values (Copy by Reference) Objects మరియు arrays భిన్నంగా పనిచేస్తాయి. ఇవి references ఉపయోగిస్తాయి. మీరు ఒక object ని కాపీ చేసినప్పుడు, మెమరీలో దాని లొకేషన్‌కు సంబంధించిన pointer ని మాత్రమే కాపీ చేస్తారు.

Example:

let original = { name: "YOO" };
let copy = original;
copy.name = "NEW";

Result: original.name ఇప్పుడు "NEW" గా మారుతుంది.

తేడా: Shallow vs Deep

Shallow copy అనేది ఒక object యొక్క పై స్థాయిని (top level) మాత్రమే కాపీ చేస్తుంది. ఒకవేళ ఆ object లో nested objects ఉంటే, అవి ఇంకా అసలు (original) nested references నే సూచిస్తాయి. Deep copy అనేది అన్ని కొత్త విలువలతో పూర్తిగా కొత్త object ని సృష్టిస్తుంది.

దీనిని పిజ్జా ఉదాహరణతో అర్థం చేసుకుందాం:

  • Shallow Copy: మీరు మరియు మీ స్నేహితుడు ఒకే పిజ్జాను పంచుకుంటున్నారు. మీ స్నేహితుడు ఒక ముక్క తింటే, మీకు కూడా పిజ్జా తగ్గిపోతుంది.
  • Deep Copy: మీ ఇద్దరికీ వేర్వేరు పిజ్జాలు ఉన్నాయి. మీ స్నేహితుడు ఒక ముక్క తిన్నా, మీ పిజ్జా అలాగే ఉంటుంది.

Shallow Copy పద్ధతి మీరు shallow copy చేయడానికి spread operator (...) ని ఉపయోగించవచ్చు.

let original = { name: "YOO", details: { age: 22 } };
let copy = { ...original };

Warning: మీరు original.details.age ని మారిస్తే, copy.details.age కూడా మారుతుంది. ఇదే shallow copy యొక్క చిక్కు (trap).

Deep Copy పద్ధతులు

  1. structuredClone() ఇది ఆధునిక బ్రౌజర్‌లు మరియు Node.js లలో ఉండే ఒక built-in function. ఇది nested structures ను ఖచ్చితంగా హ్యాండిల్ చేస్తుంది.

Pros:

  • వేగవంతమైనది మరియు native.
  • Dates, RegExp, మరియు Maps ను హ్యాండిల్ చేస్తుంది.

Cons:

  • ఒకవేళ object లో functions లేదా DOM nodes ఉంటే ఇది పనిచేయదు.
  1. JSON.parse(JSON.stringify()) ఇది ఒక పాత పద్ధతి, ఇందులో మీరు ఒక object ని string గా మార్చి, మళ్ళీ తిరిగి object గా మారుస్తారు.

దీనిని ఎందుకు నివారించాలి:

  • ఇది undefined, Map, Set, లేదా Infinity వంటి డేటాను కోల్పోతుంది.
  • ఇది కొన్ని విలువలను దెబ్బతీస్తుంది (corrupt చేయవచ్చు).

Source: https://dev.to/yogesh_992/shallow-copy-vs-deep-copy-in-java-script-explained-in-easiest-way-3dg5