How to determine?
Shallow Copy
Criteria:
- Only the top-level properties are copied. Nested objects are copied by reference.
Indicators:
- If modifying a nested object in the copied object also changes the original object's nested object, it is a shallow copy. Both the original and copied objects' nested objects will have the same reference.
let original = {
name: "Alice",
address: { city: "Wonderland" }
};
let shallowCopy = { ...original }; // Shallow copy
shallowCopy.address.city = "New Wonderland";
console.log(original.address.city); // Output: "New Wonderland"
console.log(shallowCopy.address.city); // Output: "New Wonderland"
console.log(original.address === shallowCopy.address); // Output: true
Deep Copy
Criteria:
- All properties, including nested objects, are fully copied. No references to the original nested objects are retained.
Indicators:
- If modifying a nested object in the copied object does not change the original object's nested object, it is a deep copy.
- The original and copied objects' nested objects will have different references.
let original = {
name: "Alice",
address: { city: "Wonderland" }
};
let deepCopy = JSON.parse(JSON.stringify(original)); // Deep copy
deepCopy.address.city = "New Wonderland";
console.log(original.address.city); // Output: "Wonderland"
console.log(deepCopy.address.city); // Output: "New Wonderland"
console.log(original.address === deepCopy.address); // Output: false
Steps to Check Copy Type
1. Create Original Object:
Define an object with nested properties.
let original = {
name: "Alice",
address: { city: "Wonderland" }
};
2. Make a Copy:
Create a copy using your chosen method.
let copy = { ...original }; // For shallow copy
// or
let copy = JSON.parse(JSON.stringify(original)); // For deep copy
3. Modify Nested Property in Copy:
Change a nested property in the copied object.
copy.address.city = "New Wonderland";
4. Check Original Object:
Compare the nested property in the original object.
console.log(original.address.city); // Check if this has changed
5. Compare References:
Check if the nested objects are the same reference.
console.log(original.address === copy.address); // true for shallow, false for deep
Summary
Shallow Copy:
- Top-level properties are copied.
- Nested objects are shared (same reference).
- Modifying nested objects in the copy affects the original.
Deep Copy:
- All properties, including nested objects, are fully copied.
- Nested objects are not shared (different references).
- Modifying nested objects in the copy does not affect the original.
By following these steps and criteria, you can determine whether an object copy is shallow or deep.