JavaScript"for in"循环中的问题

Jos*_*eph -2 javascript arrays loops object for-in-loop

我有一系列对象,它们将成为我网站中某个菜单的基础.它将使用JavaScript构建:

[
  {"menuName":"Contact Info","sectionName":"contacts"},
  {"menuName":"Facilities","sectionName":"facilities"},
  {"menuName":"Locations","sectionName":"locations"},
  {"menuName":"Packages","sectionName":"packages"},
  {"menuName":"Policies","sectionName":"policies"},
  {"menuName":"Reviews","sectionName":"reviews"},
  {"menuName":"Rooms","sectionName":"rooms"}
]
Run Code Online (Sandbox Code Playgroud)

所以我决定使用"for in loop",这样我就不必处理索引和长度了.我建议在构建时在菜单中显示七个项目(我将使用<ul><li>).

当我调试并意外地添加了背景颜色<li>时,是什么时候全都崩溃了.<li>在可见的第7个菜单后,我发现至少有30个空<li>.

为什么会这样?

编辑:

这是循环.循环为另一个函数创建另一个对象,以便稍后解析.(它创建一个<li>带有<a>前一个数组提供的属性的内部.)我知道另一个函数工作正常,因为当我将这个"for-in"循环更改为普通for循环或while循环时,它工作正常.

this.sectionList = function(menu, id) {
    var list = new Array();

    for(var i in menu) {
        var listItem = {
            "element" : "li",
            "contains" : [{
                "element" : "a",
                "attr" : {
                    "href" : menu[i].sectionName + ':' + id
                },
                "contains" : menu[i].menuName
            }]
        }
        list.push(listItem);
    }
}
Run Code Online (Sandbox Code Playgroud)

Lig*_*ica 10

for in迭代对象属性.Javascript数组只是一种特定类型的对象,有一些方便的属性可以帮助你将它们视为数组,但它们仍然具有内部对象属性..并不意味着迭代这些属性).

因此,您不应该使用for in迭代数组.只有在添加背景颜色时,这才会变得明显,但情况总是如此.

相反,循环使用计数器和数组.length.