Hvad er forskellen mellem en grundig og en dyb kopi?

Question

Accepted Answer

Objekter tildeles **ved reference**, så `b = a` kopierer ikke — begge peger på det samme objekt. En **grundig** kopi duplikerer det øverste niveau, men deler indlejrede referencer; en **dyb** kopi duplikerer alt, fuldt uafhængig.

```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 indlejrede `address`-objekt er **den samme reference** i begge, så mutation af det påvirker begge.

## Oprettelse af en dyb kopi

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

Andre muligheder 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 betyder noget

Dette er en topkilde til "hvorfor ændrede min tilstand sig uventet?" fejl, især i React/Redux, hvor du må ikke mutere tilstand.

Spread er fint, når du kun ændrer felter på øverste niveau, men for indlejrede opdateringer skal du også kopiere det indlejrede niveau (`{ ...obj, address: { ...obj.address, city } }`) eller foretage en dyb klone.