javascript - 具有相同属性的两个对象。删除一个对象的属性有什么影响？

Question

我对这两种情况感到困惑:

第一个:

let a: object = {'name': 'gavin'};
let b: object = {};
b['name'] = a['name']; // at this time. a and b are both {'name': 'gavin'};
delete a['name']; // now a is {} and b is {'name': 'gavin'}

第二个:

let a: object = {'tag': {'name': 'gavin'}};
let b: object = {};
b['tag'] = a['tag']; // at this time. a and b are both {'tag': {'name': 'gavin'}};
delete a['tag']['name']; // now a and b are both {'tag': {}}

在第二种情况下，如果我删除 a['tag']，a 将是 {}，b 将是 {'tag': { “姓名”:“加文”}}。如我所料，如果我删除 a['tag']，b 将为空，如果我删除 a['tag']['name']，b 将为不受影响。为什么会出现这样的结果？

英语不是我的母语，如果我有拼写错误，请随时告诉我。

Answer 1

在您的第一个示例中，您分配了一个字符串 b['name'] = a['name']。字符串在 javascript 中按值传递，因此有效地在内存中创建了该字符串的新副本。 a['name'] 不等于 b['name'] 就它们引用的实际内存位置而言。

您可以认为这是一个字符串的两个副本。删除字符串时，会删除一个副本，但不会删除另一个副本。

在您的第二个示例中，您正在分配一个对象 b['tag'] = a['tag']。对象在 javascript 中通过引用传递，这意味着您不是在创建对象的新副本，而是将同一对象分配给 b['tag']。所以 a['name'] 与 b['name'] 是同一个对象。

您可以将其视为具有对象的一个​​副本，其中 a['tag'] 和 b['tag'] 都使用该副本.当您从该单个副本中删除 name 属性时，它不会出现在 a['tag'] 或 b['tag'] 中，因为它们都使用相同的对象。

这个问题的答案可能有助于您更好地理解值与对象引用 https://stackoverflow.com/a/37290849/845704

编辑

为了更好地理解，让我们将您的示例与一个附加变量一起使用。请记住，这在数据结构方面与您的示例没有什么不同，只是多了几行代码。

let tag_obj = {'name': 'gavin'};
let a = { 'tag': tag_obj };
let b = {};
b['tag'] = a['tag'];

// a and b both now equal { tag: { name: 'gavin'} }

console.log(a.tag === tag_object) // True, it references tag object
console.log(b.tag === tag_object) // Also true, as it references the same object.

delete a.tag.name; 

现在，如果您删除a.tag，您就是从a 对象中删除一个属性。这不应该影响其他任何东西，因为 a 不等于其他任何东西。但是，当您删除 a.tag.name 时，您是在从 tag 对象中删除一个属性，我们在上面的示例中将其称为 tag_object .由于 a.tag 和 b.tag 都引用了 tag_object，它们现在都将显示为没有名称属性。

---

没有本地“运算符”来制作对象的额外副本，但有一些常用方法。第一个是 Object.assign，它将一个对象的属性分配给另一个对象

let j = {'tag': {'name': 'james'}};
let k = j
console.log(k === j) // Will log true, they are the same object

let a = {'tag': {'name': 'gavin'}};
let b = Object.assign({}, a);
console.log(a === b) // Will log false, a new object has been created.

现在两个对象看起来都一样了。不幸的是，Object.assign 创建了所谓的浅拷贝。所以对象本身是不同的，但是对象内部的任何引用都将被共享

let a = {'tag': {'name': 'gavin'}};
let b = Object.assign({}, a);
console.log(a.tag === b.tag) // Will log true, they share the same tag object

周围有一些实用程序库可以为您创建对象的深拷贝。您也可以自己通过遍历整个对象树以递归方式执行此操作。

但是，创建对象的深拷贝的一种常见且相当快速的方法是使用 JSON。

let j = {'tag': {'name': 'james'}};
let k = JSON.parse(JSON.stringify(j));
console.log(j === k); // Will log false, a new object has been created.
console.log(j.tag === k.tag); // Will log false, a new object has been created.

此机制首先使用 JSON.stringify 生成一个新字符串，此时它不再与源对象相关联。然后，它使用 JSON.parse 从该字符串生成一个全新的对象。

注意

如果您使用 JSON 方法，则不会保留函数，因为无法以任何标准 JSON 格式序列化函数。