Hva er forskjellen mellom en grunn og en dyp kopi?

Question

Accepted Answer

Objekter tildeles **etter referanse**, så `b = a` kopierer ikke — begge peker til samme objekt. En **grunn** kopi dupliserer toppnivået men deler nestede referanser; en **dyp** kopi dupliserer alt, fullt uavhengig.

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

Det nestede `address`-objektet er **samme referanse** i begge, så mutasjon av det påvirker begge.

## Lage en dyp kopi

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

Andre alternativer og deres forbehold:

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

## Hvorfor det er viktig

Dette er en toppkilde til "hvorfor endret staten seg uventet?" feil, spesielt i React/Redux hvor du ikke må mutere state.

Spread er greit når du bare endrer toppnivåfelt, men for nestede oppdateringer må du kopiere det nestede nivået også (`{ ...obj, address: { ...obj.address, city } }`) eller gjøre en dyp klon.