遍历对象数组 returns 'undefined'

Question

我有两个数组。

var fruits = [];

var tasks = [];

当我在文本字段中输入一个值时，它会触发一个将值推送到数组的函数。然后它会触发一个单独的函数，将数组字符串化并将其保存在本地存储中。（"when" 是 document.addeventlistener 的别名）。

when(toDo, "keypress", function(event){
  if (event.key == "Enter" || event.keyCode == 13) {
    pushArray();
    stringifyArray(fruits);
    toDo.value = "";
  }
});

// function that adds new task to the array
function pushArray(){
  var newtask = new Task(toDo.value, "No note yet");
  fruits.push(newtask);  
}

// function that stringifies given array and stores it in local storage
    function stringifyArray(array){
      var makeString = JSON.stringify(array);
      var setItem = localStorage.setItem("tasks", makeString);
    }

当我遍历第一个数组并尝试显示 object.Name 和 .Note 在 div 中它工作正常：

when(button, "click", function(event){
  demolist.innerHTML = "";
   for(i=0; i< fruits.length; i++){
     demolist.innerHTML += fruits[i].Name + " " + fruits[i].Note + "<br>";
   }
});

但是当我触发一个解析该数组的函数时，填充第二个并尝试以相同的方式遍历它我得到 "undefined undefined" 即使我可以看到该数组包含我提交的所有对象当我检查控制台时。

function parseArray(){
  var getArray = localStorage.getItem("tasks");
  var parseObj = JSON.parse(getArray);
  tasks.push(parseObj);
}



 when(button2, "click", function(event){
function parseArray()
      demolist2.innerHTML = "";
       for(i=0; i< tasks.length; i++){
         demolist2.innerHTML += tasks[i].Name + " " + tasks[i].Note + "<br>";
       }
    });

https://jsfiddle.net/bjxs3LdL/ （没有 JQUERY 解决方案请）

我是编码和 Whosebug 的新手，所以请原谅冗长的 post。

Answer 1

parseArray 调用错误，请尝试像这样重写 button2 侦听器：

when(button2, "click", function(event){
      parseArray();
      demolist2.innerHTML = "";
       for(i=0; i< tasks.length; i++){
         demolist2.innerHTML += tasks[i].Name + " " + tasks[i].Note + "<br>";
       }
    });

否则，您的代码需要重新设计，但这是另一个机会。

Answer 2

通过更改

来修复您的 parseArray() 函数

tasks.push(parseObj);

到

tasks = parseObj;

编辑：很抱歉所有的编辑，我很难围绕控制流。要解决第一条笔记未保存的问题，请在 submitNote() 函数末尾添加一个 stringifyArray(fruits); 调用。

遍历对象数组 returns 'undefined'

looping through object array returns 'undefined'

javascript

arrays

json

javascript-objects