Deep clone a nested object so edits stop leaking into the original

I copy a settings object with the spread operator, change one nested field on the copy, and the original changes too.

Beginner to intermediateRead 4 minDoing: about an hour6 steps

▶ Start

What you'll have at the end

A clone function where editing the copy's nested fields never changes the original object

Before you start

You need

a plain object your interface already copies before letting someone edit it, with at least one nested object or array inside, like a widget's style settings or a list of records

Not covered

keeping a clone usable after it's transferred to a Web Worker instead of copied, and supporting a browser too old to have the clone function this recipe relies on

Leans on

6 steps

Where to go next

Save a user's settings in localStorage so a refresh doesn't lose them

when the cloned object is also what your app writes to localStorage between visits, since a clone by itself won't survive a page refresh

Checked 21 Aug 2026

Part of the JavaScript cookbook