When you clone (assign) an object, it doesn't clone the values of objects within, it clones the reference. Which means both objects, the original and the clone are referencing the same nested objects.
It's a tricky and sometimes frustrating quality of JS. Strings, numbers, bools will clone as expected, but objects will continue to reference the same thing.
Think of assigning a DOM element to a variable. The DOM element still exists, and modifying the variable will still affect the DOM. That's because objects are passed by reference!
This clones, but doesn't deep clone. If you mutate an object nested within
source
it'll also mutate the target and vice versa.That will not happen because the first argument is a new object.
To compare:
You can pretty straightforwardly check if that's the case by testing it in the console.
Objects are passed by reference, not value.
When you clone (assign) an object, it doesn't clone the values of objects within, it clones the reference. Which means both objects, the original and the clone are referencing the same nested objects.
It's a tricky and sometimes frustrating quality of JS. Strings, numbers, bools will clone as expected, but objects will continue to reference the same thing.
Think of assigning a DOM element to a variable. The DOM element still exists, and modifying the variable will still affect the DOM. That's because objects are passed by reference!
The DOM part makes me get it.