嵌套对象相互覆盖

Question

我对在我看来相当简单的数据结构有一些疑问。我有一个名为 mylist 的对象，其中包含 1. 一个嵌套的空 {} 和 2. 一个将对象添加到 (1) 中的函数。请考虑以下代码：

var object1 = {name: "Object_1"}
var object2 = {name: "Object_2"}
var mylist = {
    list: {},
    add: function(item, val){
        this.list[item] = val
    }
}
mylist.add(object1,5)
mylist.add(object2,10)
console.log(mylist)

现在，我希望输出为

{ list: { object1: 5, object2: 10 }, add: [Function] }

但我得到的是：

{ list: { '[object Object]': 10 }, add: [Function] }

由于某种原因，列表中以前的对象被覆盖。似乎也发生了某种字符串转换（由于引号），但我不确定为什么。为什么我没有得到我期望的输出？有人有这方面的好资源吗？

非常感谢。莫里茨

Answer 1

问题是当您将属性添加到 this.list[item] 这样的对象时 JavaScript 使用 toString()(JavaScript 属性有一个字符串键）。

现在当运行 toString() 在 object1 和 object2 上时，结果是 [Object object]。因此，当第一个对象添加到 list 时，它的键变为 [Object object]。添加第二个对象时，它也将具有相同的键 [Object object]，因此将覆盖前一个。

因此，要使您的代码正常工作，只需将 .name 添加到 item。

var object1 = {name: "Object_1"};
var object2 = {name: "Object_2"};
var mylist = {
    list: {},
    add: function(item, val){
        this.list[item.name] = val;
    }
}
mylist.add(object1,5);
mylist.add(object2,10);
console.log(mylist.list);

Answer 2

这是因为您传递的是一个对象而不是字符串，所以每当您这样做时：

mylist.add(object1,5);

而不是传递对象 object1，您应该传递一个字符串：

mylist.add(object1.name,5);

这将 return:

{ list: { "Object_1": 5 }, add: [Function] }

否则，如果您不发送字符串，无论您传递什么都会被转换成字符串

嵌套对象相互覆盖

Nested objects overwriting each other

javascript

nested

object