ఆల్పమైన మరియు లోతైన కాపీ మధ్య వ్యత్యాసం ఏమిటి?

Question

Accepted Answer

Objects are assigned **by reference**, so `b = a` doesn't copy — both point to the same object. A **shallow** copy duplicates the top level but shares nested references; a **deep** copy duplicates everything, fully independent.

```js
const original = { name: "Ann", address: { city: "NY" } };

// shallow copy: spread / Object.assign
const shallow = { ...original };
shallow.name = "Bob";            // ✅ independent (top-level primitive)
shallow.address.city = "LA";     // ⚠️ ALSO changes original.address.city — shared!

original.address.city; // "LA"  ← mutated through the shallow copy
```

నెస్టెడ్ `address` object రెండింటిలో ఉన్న **same reference**, కాబట్టి దానిని మార్చితే రెండింటిని ప్రభావితం చేస్తుంది.

## లోతైన కాపీ చేయడం

```js
const deep = structuredClone(original); // modern, built-in, handles most types
deep.address.city = "Chicago";          // ✅ original is untouched
```

ఇతర ఎంపికలు మరియు వాటి సూచనలు:

```js
JSON.parse(JSON.stringify(obj)); // simple, but LOSES functions, Dates → strings, undefined
// lodash: _.cloneDeep(obj)       // robust, for complex cases
```

## ఇది ఎందుకు ముఖ్యమైనది

ఇది "నా state ఎందుకు ఆశించని విధంగా మారింది?" బగ్‌ల యొక్క అగ్ర వనరు, ముఖ్యంగా React/Redux లో ఇక్కడ మీరు state ను మార్చకూడదు.

Spread కేవలం top-level fields మార్చేటప్పుడు సరైనది, కానీ nested updates కోసం మీరు నెస్టెడ్ స్థాయిని కూడా కాపీ చేయాలి (`{ ...obj, address: { ...obj.address, city } }`) లేదా deep clone చేయండి.