Check out a free preview of the full Advanced Web Development Quiz course
The "Q6: Object Reference & Destructuring" Lesson is part of the full, Advanced Web Development Quiz course featured in this preview video. Here's what you'd learn in this lesson:
Students are instructed to analyze the JavaScript code and determine what will be logged to the console.
Transcript from the "Q6: Object Reference & Destructuring" Lesson
[00:00:00]
>> All right, next question, what's the output? Is it A, name Jane, and the street is 101 Main St? Is it name Jane and the address is 102 Main St? Is it name Sarah with 101 Main St, or Sarah with 102 Main St? All right, the right answer is B, it's Jane with the 102 Main St. So what we're doing here is we first create a member object, we have Jane, and within that object, we have another object named the address, right?
[00:00:32]
So first we create that object in the heap of Jane, and then the address is another reference to another object the street, the address object. Then we create a new object using the spread operator. We create member2. Now, one thing to remember about the spread operator is that it only enables shallowing copying objects, which means that the top-level properties are duplicated.
[00:00:55]
So in this case, name Jane, but the rest holds like the address is actually a direct reference to the copied object. So that's not copied by value, it's copied by reference. So member2.address points to the same object in memory as member.address. So now when we change member.address.St to 102 Main St, It changes that on the object that is shared with both member and member2.
[00:01:22]
Now when we just change the member.name to Sarah, that change is only reflected within the member object. So when we now log member2, you will see Jane because that name hasn't changed. There's no reference to member.name from member2. But the address has changed because that's referring to the same object as the member, which is where we updated that value.
[00:01:44]
So you'll see Jane and 102 Main St.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops