问题
var foo = {x: 1}
var bar = {__proto__: foo} // __proto__ specific to implementation
var bar = Object.create(foo) // same result as above with standard API
console.log(bar.x) // 1
foo.x = 2
console.log(bar.x) // 2
bar.x = 3
console.log(foo.x) // 2
Why did updating the inherited property x by the child object bar take no effect on the parent object foo but the opposite do?
@EDIT
After its creation the child own property remains unaffected when the parent object updates the shadowed property now.
foo.x = 4
console.log(bar.x) // 3
回答1:
Assigning to an object property creates or updates the object's own property, there is no search on the prototype chain for an inherited property.
See ECMAScript Simple Assignment ( = ) §11.13.1.
回答2:
It's all about prototypes. bar object has no x property, so when you try to access it, prototypes chain will be involved, and you will get value of foo.x. Then you update foo.x, and while accessing bar.x you will see another value also.
But when you set bar.x, x property will be created in bar object. foo.x is another one so it will stay the same.
And you should avoid using __proto__ in your code. It's browser specific feature (that's why it has underscores in name).
来源：https://stackoverflow.com/questions/27594996/updating-inherited-property