ProgramGuru

Copy Objects Without Sharing Every Field

Copy Objects Without Sharing Every Field

Object spread copies own enumerable properties into a new outer object. A nested class record is still shared unless you deliberately copy that nested object too. Immutability requires a strategy, not merely const.

Before this topic, review Understand Prototype Lookup if its terms are unfamiliar.

What you’ll learn

  • Explain copy objects without sharing every field through the school example.
  • Trace the shown operations and distinguish their result from displayed output.
  • Make the practice change and explain its consequence: Copying the nested profile makes the edited mark independent of the original.

Work through the school example

This is JavaScript using language features and the host console. Read the initial values, then follow each operation to its displayed result. A declaration names a value, a function call performs an operation, and console.log displays its arguments.

JavaScript · school.js · complete example

const student = { profile: { marks: 72 } };
const copy = { ...student };
copy.profile.marks = 80;
console.log(student.profile.marks);

Expected output

80
Run in JavaScript compiler →

An outer copy can share an inner object

JavaScript · source for this model

const student = { profile: { marks: 72 } };
const copy = { ...student };
copy.profile.marks = 80;
console.log(student.profile.marks);

This diagram follows the supplied example. It is an explanatory model, not a JavaScript engine or a timing guarantee.

An outer copy can share an inner object

  1. Original record

    student.profile refers to the nested profile.

    marks = 72
  2. Copy outer properties

    copy.profile points to the same profile object.

    student.profile → profile ← copy.profile
  3. Edit the nested field

    Both outer records observe the new nested mark.

    80
Follow the relationships and values in the example.

Recognize the important boundary

structuredClone supports many data types but not functions and every platform object. JSON round-tripping is not a universal clone.

Try a small variation

JavaScript · original source for practice

const student = { profile: { marks: 72 } };
const copy = { ...student };
copy.profile.marks = 80;
console.log(student.profile.marks);

Your task: Replace {...student} with {...student, profile:{...student.profile}}. Predict the result before running the edited program.

The source is repeated here. If the edit targets the HTML rather than the script, use the markup repeated below; the worked answer also repeats the changed markup.

Worked answer and reasoning

Copying the nested profile makes the edited mark independent of the original.

JavaScript · complete worked variation

const student = { profile: { marks: 72 } };
const copy = { ...student, profile: { ...student.profile } };
copy.profile.marks = 80;
console.log(student.profile.marks);

Expected output

72
Run in JavaScript compiler →

Predict the original program

JavaScript · original program for this question

const student = { profile: { marks: 72 } };
const copy = { ...student };
copy.profile.marks = 80;
console.log(student.profile.marks);
What does the original JavaScript program display, in order?
Choose one answer. You can try again.

Answer and explanation

80

Object spread copies own enumerable properties into a new outer object. A nested class record is still shared unless you deliberately copy that nested object too. Immutability requires a strategy, not merely const. structuredClone supports many data types but not functions and every platform object. JSON round-tripping is not a universal clone.

Keep the useful idea

Object spread copies own enumerable properties into a new outer object. A nested class record is still shared unless you deliberately copy that nested object too. Immutability requires a strategy, not merely const.

Check your variation against this explanation: Copying the nested profile makes the edited mark independent of the original.

Use the JavaScript array reference library for individual array operations and boundary tests to check a rule independently.

Reaching the recap and completing the quizzes are separate milestones.

    Next lesson: Exchange and Validate JSON →