javascript - 迭代数组时看到打印的 "undefined"

Question

我正在迭代一个 JavaScript 数组对象。我编写了一个迭代数组元素的函数。它有效，但结果上方写着“未定义”。我不想看到这个，知道如何解决这个未定义单词的问题会有很大帮助。

var userlist = [{
    "username": "Tom",
    "Current_latitude": 23.752805,
    "Current_longitude": 90.375433,
    "radius": 500
  },

  {
    "username": "Jane",
    "Current_latitude": 23.752805,
    "Current_longitude": 90.375433,
    "radius": 400
  },

  {
    "username": "Dave",
    "Current_latitude": 23.765138,
    "Current_longitude": 90.362601,
    "radius": 450
  }, {
    "username": "Sarah",
    "Current_latitude": 23.792452,
    "Current_longitude": 90.416696,
    "radius": 600
  },

  {
    "username": "John",
    "Current_latitude": 23.863064,
    "Current_longitude": 90.400126,
    "radius": 640
  }
];


var x = Tom(userlist);

function Tom(user) {
  var text;
  for (var i = 0; i < user.length; i++) {
    text += "<li>" + user[i].username + "</li>";
  };
  //text+="</ul>"
  document.getElementById("demo").innerHTML = text;
}

//document.getElementById("demo").innerHTML=userlist[0].username+" "+userlist[0].Current_latitude +  " " + userlist[0].Current_latitude+"" + userlist[0].Current_longitude+" "+ userlist[0].radius;

<p>How to create A javaScript Object Array.</p>
<p id="demo"></p>

Answer 1

您需要初始化您的变量 text为空字符串，如下所示:

var text = "";

JavaScript 中未初始化的变量默认为特殊值 undefined ，它在串联中作为文本找到。

正如评论中所指出的，您的 HTML 中也存在问题:<li>标签应该只出现在包含 <ul> 的内部, <ol>或<menu>标签。您可以考虑更改您的<li> ... </li>类似 <div> ... </div>或用 <ul> 包装文本串联文本... </ul> .