JQuery将对象推入数组会覆盖所有数组对象

Question

我正在尝试使用表单输入中的键“名称”将对象推送到数组中。我从表单中获取信息并记录 object.name & id。它位于覆盖先前对象值的输入中的以下条目上。 我如何在这里覆盖所有对象值？ 谢谢！

        let inputValues = [];
        let newTodoInput = {};
        let idNumber = 0;

        function bindEvents() {
            $('form').on('submit', function() {
                event.preventDefault();
                newTodoInput.name = $('.new-todo').val(); // obj
                newTodoInput.id = idNumber++;
                inputValues.push(newTodoInput);

                $('form').trigger("reset"); // clear form
            });
        }

数组中的第一个条目

0:Object
id:1
name:"1st entry"

数组的第二个条目

0:Object
id:1
name:"2nd entry"

1:Object
id:1
name:"2nd entry"

Answer 1

您需要在事件处理程序中定义let newTodoInput = {}。问题是您正在创建对该对象的单个引用，对其进行更新，并将对该对象的引用推送到数组中。让我非常清楚 - 您不是在推送该对象的实例，而是将对该对象的 reference 推送到数组中。所以下次它被触发时，你更新 name 和 id 属性，这会更新原始对象，这会被引用该对象的每个数组元素反映。

$('form').on('submit', function() {
  event.preventDefault();
  var newTodoInput = {}; // <-- This is the key to this working properly
  newTodoInput.name = $('.new-todo').val(); // obj
  newTodoInput.id = idNumber++;
  inputValues.push(newTodoInput);

  $('form').trigger("reset"); // clear form
});