Shallow Copy Example

    let employee = {
        name: 'Biswajit Jana',
        org: 'Capgemini',
        address: {
            city: 'Bengalore',
            state: 'Karnataka',
            pin: 560037,
            place: 'Marathahalli'
        }
    };
    const newEmployee = Object.assign({}, employee);
    // OR: const newEmployee = { ...employee };
    newEmployee.name = 'Amit Mandal';
    newEmployee.address.city = 'Kolkata';
    console.log('Original Copy =>', employee);
    console.log('New Copy =>', newEmployee);
    

Output

        Original Copy => {
        "name": "Biswajit Jana",
        "org": "Capgemini",
            "address": {
                "city": "Kolkata",
                "state": "Karnataka",
                "pin": 560037,
                "place": "Marathahalli"
            }
        }

        New Copy => {
            "name": "Amit Mandal",
            "org": "Capgemini",
            "address": {
                "city": "Kolkata",
                "state": "Karnataka",
                "pin": 560037,
                "place": "Marathahalli"
            }
        }
    

Explanations

Updating the top-level property (name) affects only the new object.

Updating the nested property (address.city) affects both objects.

This happens because the nested address object is shared by reference.

Key Points to Remember

• Copies only the top-level properties
• Nested objects/arrays are still shared
• Changes in nested data affect both copies

Ways to Create a Shallow Copy

• Using Object.assign({}, employee)
• Using spread operator (e.g. {…employee})

Limitation

Shallow copy does not protect nested objects or arrays from shared
mutations.

Deep Copy Example

A deep copy creates a completely independent copy of an object, including
all nested levels.

Each nested object or array gets a new memory reference.

        let employee = {
            name: 'Biswajit Jana',
            org: 'Capgemini',
            address: {
                city: 'Bengalore',
                state: 'Karnataka',
                pin: 560037,
                place: 'Marathahalli',
            },
            years: [2016, 2018]
        };

        // Deep copy example
        const newEmployee = {
            ...employee,
            address: {
                ...employee.address
            },
            years: {
                ...employee.years
            }
        };
        // OR const newEmployee = JSON.parse(JSON.stringify(employee));
        // OR const newEmployee = structuredClone(employee);
        // structuredClone() is available starting from ES2021 (ECMAScript 2021).
        newEmployee.name = 'Amit Mandal';
        newEmployee.address.city = 'Kolkata';
        newEmployee.years[0] = 2014;

        console.log('Original Copy =>', employee);
        console.log('New Copy =>', newEmployee);
    

            Original Copy => {
            "name": "Biswajit Jana",
            "org": "Capgemini",
            "address": {
                "city": "Bangalore",
                "state": "Karnataka",
                "pin": 560037,
                "place": "Marathahalli"
            },
            "years": [2016, 2018]
        }

            New Copy => {
            "name": "Amit Mandal",
            "org": "Capgemini",
            "address": {
                "city": "Kolkata",
                "state": "Karnataka",
                "pin": 560037,
                "place": "Marathahalli"
            },
            "years": [2014, 2018]
        } 
        

Explanations

Changes to nested properties (address.city, years[0]) in the new object do not affect the original.

Each nested level has its own memory reference.

This behavior confirms a proper deep copy.

Key Points to remember

• Copies all levels
• Nested objects get new memory
• Changes do not affect original object