Javascript Prototypal Inheritance & object properties shadowing

Question

var person = { name :\"dummy\", personal_details: { age : 22, country : \"USA\" } };

var bob = Object.create(person);

bob.name = \"bob\";
bob.personal_details.age          


        

Answer 1

I hope that the diagram bellow is clear enough, but I'll try to explain in short what's happening.

When you create new object with Object.create you create an object with prototype the first argument of the method create. So you create bob with prototype which points to the person object. All properties of person are accessible by bob through the reference to it's prototype.

In the next picture you change bob's name. It's now bob so simply you create new slot or property of bob which name is name (now the interpreter won't check the prototype chain when looking for property name it'll directly find that bob has such property).

In the third one you change bob.personal_details.age which affects to person.personal_details.age because simply that's the same object.

At last you set the property personal_details, now bob has slot personal_details, it's not a prototype property it's a reference to another object - the anonymous one.