Skip to content

Object basics: Clearer wording/example with mutations & references #29846

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
+12 −6
Open

Object basics: Clearer wording/example with mutations & references #29846

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 12 additions & 6 deletions foundations/javascript_basics/object_basics.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,20 +86,26 @@

<div class="lesson-note" markdown="1">

#### Reassigning object data type variables

While mutating the object we have a reference to affects all other variables that reference it, reassigning a variable does not change what the other variables refer to. For example:
#### Mutating the properties of an object vs. reassigning the object variables

Check failure on line 89 in foundations/javascript_basics/object_basics.md

View workflow job for this annotation

GitHub Actions / Lint lesson files

Headings should be surrounded by blank lines 

foundations/javascript_basics/object_basics.md:89 MD022/blanks-around-headings Headings should be surrounded by blank lines [Expected: 1; Actual: 0; Below] [Context: "#### Mutating the properties of an object vs. reassigning the object variables"] https://github.com/DavidAnson/markdownlint/blob/v0.32.1/doc/md022.md
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the new heading is a little verbose for a heading

Suggested change
#### Mutating the properties of an object vs. reassigning the object variables
#### Mutation vs. reassignment

When you have multiple variables that reference the same object, mutating the properties of that object will affect all the variables that reference it. However, reassigning the object variable to a new object will only change the value of that specific variable, and will not affect the other variables that previously referenced the original object. For example:
Copy link
Contributor

@mao-sz mao-sz Sep 7, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just some small wording tweak given the rest of the review comments. Strength added to the mutate and reassign keywords.

Suggested change
When you have multiple variables that reference the same object, mutating the properties of that object will affect all the variables that reference it. However, reassigning the object variable to a new object will only change the value of that specific variable, and will not affect the other variables that previously referenced the original object. For example:
When multiple variables reference the same object, **mutating** that object will affect all the variables that reference it. However, **reassigning** a variable to a new object will only change the value of that specific variable, and will not automatically reassign any other variable that referenced the original object. For example:


```javascript
let animal = { species: "dog" };
let dog = animal;

// reassigning animal variable with a completely new object
animal = { species: "cat" };
// Mutating the properties of the object that both 'animal' and 'dog' reference
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The object is being mutated, not the property (which is actually being reassigned)

Suggested change
// Mutating the properties of the object that both 'animal' and 'dog' reference
// Mutating the object that both 'animal' and 'dog' reference

animal.species = "cat";

console.log(animal); // { species: "cat" }
console.log(dog); // { species: "dog" }
console.log(dog); // { species: "cat" }

// Reassigning the 'animal' variable to a new object
animal = { species: "bird" };

console.log(animal); // { species: "bird" }
console.log(dog); // { species: "cat" }
```

Check failure on line 107 in foundations/javascript_basics/object_basics.md

View workflow job for this annotation

GitHub Actions / Lint lesson files

Fenced code blocks should be surrounded by blank lines 

foundations/javascript_basics/object_basics.md:107 MD031/blanks-around-fences Fenced code blocks should be surrounded by blank lines [Context: "```"] https://github.com/DavidAnson/markdownlint/blob/v0.32.1/doc/md031.md
In the first part, when we modify the species property of the object that both `animal` and `dog` reference, the change is reflected in both variables. In the second part, when we reassign the `animal` variable to a new object, the `dog` variable still references the original object, while `animal` now points to the new object.
Copy link
Contributor

@mao-sz mao-sz Sep 7, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixing with the same as the previous review comment, and a small re-wording to accommodate that.

Suggested change
In the first part, when we modify the species property of the object that both `animal` and `dog` reference, the change is reflected in both variables. In the second part, when we reassign the `animal` variable to a new object, the `dog` variable still references the original object, while `animal` now points to the new object.
In the first part, there is only one object which is referenced by both `animal` and `dog`. When we mutate that object, the change is reflected in both variables. In the second part, when we reassign the `animal` variable to a new object; the `dog` variable still references the original object, while `animal` now points to the new object.


</div>

Expand Down
Loading