Question

我有一系列对象，它们将成为我网站中某个菜单的基础。它将使用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"}
]

所以我决定使用“for in loop”，以便我不必处理索引和长度。我希望在构建时会在菜单中显示七个项目（我将使用<ul>和<li>）。

当我进行调试并意外地为<li>添加背景颜色时，是什么时候一切都崩溃了。我在可见的第7个菜单<li>后找到了至少30个空<li>。

为什么会这样？

修改

这是循环。循环为另一个函数创建另一个对象，以便稍后解析。（它创建一个<li>，其中<a>内部包含前一个数组提供的属性。）我知道另一个函数工作正常，因为当我将这个“for-in”循环更改为普通的for循环时，或循环，它工作正常。

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);
    }
}

Answer 1

for in遍历对象属性。 Javascript数组只是一种特定类型的对象，有一些方便的属性可以帮助你将它们视为数组，但它们仍然具有内部对象属性..而你并不是要迭代它们。）

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

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

Answer 2

您的对象获取JavaScript本身传递的方法和属性。这些是每个对象在创建时获得的方法。

您必须使用.hasOwnProperty来仅查找分配给对象的属性和方法！

for(var i in myObject){
  if(myObject.hasOwnProperty(i)){
    console.log(myObject.i);
  }
}

希望有所帮助！

以下两篇文章帮助我更好地理解了它：

http://bonsaiden.github.com/JavaScript-Garden/#object.hasownproperty http://javascriptweblog.wordpress.com/2011/01/04/exploring-javascript-for-in-loops/

Answer 3

我认为在这个jsFiddle中迭代数据结构的两种方式没有区别：http://jsfiddle.net/jfriend00/HqLdk/。

有很多理由说明为什么不在数组上使用for (x in array)。主要原因是这种类型的迭代迭代了对象的属性，而不仅仅是数组元素。这些属性可以包括数组的其他属性（如果已添加），因为for (var i = 0; i < array.length; i++)方法永远不会出现添加属性的问题，因为根据定义，它只迭代数组元素。

幸运的是，当没有向数组对象添加其他属性时，迭代属性恰好包含数组元素。该语言不希望您以这种方式迭代数组元素。您应该使用

迭代数组

for (var i = 0; i < array.length; i++)。

我理解简单语法的诱惑，但这不是正确的方法。

JavaScript“for in”循环中的问题

3 个答案: