Javascript 当我想将我的对象添加到对象中时，为什么此代码会覆盖它

我有以下代码。除了一件事之外，一切都如我所愿。当用户输入另一个项目名称（保持房间名称不变）时，将擦除原始项目名称。我需要的是它向对象中添加另一项

<div class="container">
    <div class="row">
        <div class="col-md-4">
             <form>
                <div class="form-group">
                    <input type="text" name="room_name" id="room_name" class="form-control" placeholder="Room name">
                </div>
                <div class="form-group">
                    <input type="text" name="item_name" id="item_name" class="form-control" placeholder="Item name">
                </div>
                <div class="form-group">
                    <input type="text" name="item_description" id="item_description" class="form-control" placeholder="Item description">
                </div>
                <div class="form-group">
                    <input type="text" name="inventory" id="inventory" class="form-control" placeholder="DEBUG">
                </div>
                <div class="form-group">
                    <a id="submitinv" class="btn btn-success btn-block">Submit</a>
                </div>
                <table id="list" class="table table-striped">
                    <tr>
                        <th>ROOM NAME</th>
                        <th>ITEM NAME</th>
                        <th>ITEM DESCRIPTION</th>
                    </tr>
                </table>
             </form>

        </div>
    </div>
</div>
<script>
roominventory = {};
obj = {};
$('#submitinv').click(function(){
    room_name = $('#room_name').val();
    item_name = $('#item_name').val();
    item_description = $('#item_description').val();
    obj[item_name] = item_description;
    roominventory[room_name] = obj;
    $('#inventory').val(JSON.stringify(roominventory));
    obj = {};
    $('#list').append('<tr><td>' + room_name + '</td><td>' + item_name + '</td><td>' + item_description + '</td></tr>');
});

</script>

提交
房间名称
项目名称
项目说明
roominventory={}；
obj={}；
$（'#submitiv'）。单击（函数（）{
房间名称=$（“#房间名称”）.val（）；
item_name=$（'#item_name'）.val（）；
项目描述=$（“#项目描述”）.val（）；
obj【项目名称】=项目描述；
roominventory[房间名称]=对象；
$（'#inventory'）.val（JSON.stringify（roominventory））；
obj={}；
$（“#列表”）。追加（“”+房间名称+“”+项目名称+“”+项目描述+“”）；
});

当我们告诉员工：

roominventory[room_name] = obj

我们要说的是：

Find the key on the object roominventory that is equivalent to the
value room_name. I now want you to assign the value of obj to that key.

听起来这不是你想告诉你的员工的。听起来你想告诉你的员工的是：

Find the key on the object roominventory that is equivalent to the
value room_name. Now add the object to that value. 

有几种方法可以做到这一点，最简单的方法是将

roominventory

对象中的每个键设置为一个数组，执行如下操作：

// First we check if we have messed with this key before
if(roominventory[room_name] !== undefined){
  // if we have, let's just push our new object onto the list
  roominventory[room_name].push(obj)
}else{
  // if we haven't, let's create a list of a single item to add to later
  roominventory[room_name] = [obj]
}

---

通过调用obj={}覆盖对象；但是如果我不这样做，那么当用户创建一个新的房间名称时，它会从原始房间名称中携带信息，然后使用

var room\u name

。如前所述，您有多个全局变量。或者，不存储obj，而是创建它的深层副本，然后销毁初始化obj。在单击函数的开头使用

var obj={}

，并从单击外部删除全局版本。这样，每次单击都会创建一个新的obj，并将其添加到roominventory中。正如Shilly所说，您应该对每个变量使用

var

。全局变量不是一个好主意！非常感谢蒂姆。这正是我想要的，你的描述很完美。这在很多方面帮助我理解正在发生的事情。再次感谢你，克林格我可以帮助克林特，很高兴你的问题解决了！我不得不一直问自己‘我到底在告诉我的员工什么？当我告诉他们时，员工知道什么？’我发现这有助于调试和提出可重用的解决方案！