Ποια είναι η διαφορά μεταξύ μιας ρηχής και μιας βαθιάς αντιγραφής;

Question

Accepted Answer

Τα αντικείμενα εκχωρούνται **ως αναφορά**, οπότε `b = a` δεν αντιγράφει — και τα δύο δείχνουν στο ίδιο αντικείμενο. Μια **ρηχή** αντιγραφή διπλασιάζει το επάνω επίπεδο, αλλά μοιράζεται ένθετες αναφορές. μια **βαθιά** αντιγραφή διπλασιάζει τα πάντα, πλήρως ανεξάρτητη.

```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` είναι η **ίδια αναφορά** και στα δύο, οπότε η μετάλλαξή του επηρεάζει και τα δύο.

## Δημιουργία βαθιάς αντιγραφής

```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
```

## Γιατί έχει σημασία

Αυτή είναι η κορυφαία πηγή σφαλμάτων "γιατί άλλαξε η κατάστασή μου απροσδόκητα;", ειδικά σε React/Redux όπου δεν πρέπει να μετάλλαξες την κατάσταση.

Το Spread είναι εντάξει όταν αλλάζεις μόνο τα πεδία του κορυφαίου επιπέδου, αλλά για ένθετες ενημερώσεις πρέπει να αντιγράψεις και το ένθετο επίπεδο (`{ ...obj, address: { ...obj.address, city } }`) ή να κάνεις ένα βαθύ κλώνο.