关于 Object.create() 和原型链的一些麻烦？答案

【问题标题】：Some trouble about Object.create() and prototype chain?关于 Object.create() 和原型链的一些麻烦？
【发布时间】：2017-12-01 23:47:35
【问题描述】：

有两段代码：

var obj1 = {name:'one'};
obj2 = Object.create(obj1);
obj2.name = 'two';
console.log(obj1.name);                 //one


var obj1 = {prop:{name:'one'}};
obj2 = Object.create(obj1);
obj2.prop.name = 'two';
console.log(obj1.prop.name);            //two

为什么第 2 条的输出是 2？

【问题讨论】：

您刚刚将obj1 设置为obj2 的原型，这就是原因！
obj2.prop 解析为原型。所以设置它的名字来编辑它。

标签： javascript ecmascript-5

【解决方案1】：

基本上，您使用obj1 作为原型。使用时，它会生成对象的 shallow 副本。这意味着顶层是不同的（即，如果您更改obj2.prop，它不会影响obj1.prop，但较低级别是对相同事物的引用，因此更改它们会导致事物发生变化。

Object.assign()也一样：

// Shallow-copy of one level, don't affect each other
const obj1 = { a: 1 };
const obj2 = Object.assign({}, obj1);
obj2.a = 2;
console.log(obj1.a, obj2.a);

// Shallow-copy, change top-level, don't affect each other
const obj3 = { a: { b: 1 } };
const obj4 = Object.assign({}, obj3);
obj4.a = 3;
console.log(obj3.a, obj4.a);

// Shallow-copy, change inner object, affects each other
const obj5 = Object.assign({}, obj3);
obj5.a.b = 2;
console.log(obj3.a.b, obj5.a.b);

如果您想避免在多个级别下更改它，则需要进行深层复制/克隆。

（有很多不同的库可以实现这样的功能，所以我不会在这里重新实现。）

【讨论】：