javascript - 超出最大调用堆栈大小错误...我该如何修复？

Question

我正在尝试编写一个待办事项列表，该列表从输入表单中获取值，将其存储到一个对象中，将对象插入数组中，对数组进行字符串化，将其存储在本地存储中，从本地存储中检索，并将其发布到表格中。

我收到错误“超出最大调用堆栈大小”，引用我创建对象的行...我不完全确定我是否正在执行保存输入字段中的值的部分正确进入对象...帮助？谢谢

var table = document.getElementById("tableBody");

toDoArray = [];


function buildTable(){
addToStorage();
var retrievedTaskObject = localStorage.getItem("task");
var parsedObject = JSON.parse(retrievedTaskObject);
var addTheTaskName = parsedObject.taskName;
var addTheTaskDate = parsedObject.taskDate;
  var tableHTML = "";
  for(i=0; i < toDoArray.length; i++){
    var row = table.insertRow(0);
    var cellName = row.insertCell(0);
    var cellDate = row.insertCell(1);
    var cellId = row.insertCell(2);
    var cellCheck = row.insertCell(3);
    cellName.innerHTML= parsedObject[i].name;
    cellDate.innerHTML= parsedObject[i].date;
    cellId.innerHTML = 1 + i;
    var checkStuff = "<input type='checkbox'>";
    tableHTML += checkStuff;

  }
  document.getElementById("tableBody").innerHTML = tableHTML;
}

function submitForm(name,date) {
  var taskObject = {
    name: name,
    date: date,
  };

var addTaskName = document.getElementById("taskName").value;
var addTaskDate = document.getElementById("dateTask").value;
var taskSomething = submitForm(addTaskName,addTaskDate);
  toDoArray.push(taskObject);
  buildTable();
};

function addToStorage(){
  var storedArray = JSON.stringify(toDoArray);
  localStorage.setItem("task",storedArray);}

Answer 1

您正在通过调用iself中的submitForm方法来进行递归。由于没有中断条件来停止递归，因此出现最大堆栈错误

function submitForm(name,date) {
  var taskObject = {
    name: name,
    date: date,
  };

var addTaskName = document.getElementById("taskName").value;
var addTaskDate = document.getElementById("dateTask").value;
var taskSomething = submitForm(addTaskName,addTaskDate);
  toDoArray.push(taskObject);
  buildTable();
};

应该是这样的——

function submitForm(name,date) {
    var addTaskName = document.getElementById("taskName").value;
    var addTaskDate = document.getElementById("dateTask").value;
    var taskSomething = getTaskObj(addTaskName,addTaskDate);
      toDoArray.push(taskSomething);
      buildTable();
};

function getTaskObj(taskName,taskData){
var taskObject = {
        name: taskName,
        date: taskData,
      };
 return taskObject;
}