在＆QUOT;用JavaScript＆QUOT问题;循环 [英] Problems with JavaScript "for in" loop

问题描述

我有对象的数组这将是在我的网站一定菜单的基础。它将使用Build JavaScript的：

  [
  {MENUNAME：联系方式，sectionName：联系人}，
  {MENUNAME：设施，sectionName：设施}，
  {MENUNAME：位置，sectionName：位置}，
  {MENUNAME：包，sectionName：包}，
  {MENUNAME：策略，sectionName：政策}，
  {MENUNAME：评论，sectionName：评论}，
  {MENUNAME：房间，sectionName：房间}
]
 

所以我决定中环路来使用，这样我就不必处理索引和长度。我预计七品出现在菜单中时，它被建（我将使用＆LT; UL＆GT; 和＆LT;李＆GT; ）。

当我调试和意外加入了背景颜色的＆LT;立GT; ，当全乱套了。我发现至少有30空＆LT;李＆GT; 可见第七菜单后，＆LT;李方式＆gt;

为什么会出现这种情况？

编辑：

这里的循环。循环创建另一个对象另一个函数解析以后。 （它创建一个＆LT;李＆GT; 与＆LT; A＆GT; 内由previous提供的属性阵列）。我知道，因为当我改变这种换在循环一个普通的for循环其他功能正常工作，或while循环，它工作正常。

  this.sectionList =功能（菜单，ID）{
    VAR名单=新的Array（）;    对（在菜单变种I）{
        VAR的listItem = {
            元素：礼，
            包含：[{
                元素：一个，
                ATTR：{
                    的href：菜单中的[I] .sectionName +：+ ID
                }，
                包含：菜单中的[I] .menuName
            }]
        }
        list.push（的listItem）;
    }
}
 

解决方案

在在对象属性迭代。 JavaScript数组只是一种特定的对象的一些方便特性来帮助你把他们当作只是阵列，但他们仍然有内部对象属性..你不是说要遍历这些）。

所以，你不应该使用在来遍历数组。仅当您添加背景颜色变得明显给你，但它永远是这样。

相反，循环使用计数器和阵列。长度。

I have an array of objects which will be the basis for a certain menu in my website. It will be build using 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"}
]

So I decided to use the "for in loop" so that I won't have to deal with indexes and lengths. I expect seven items to appear in the menu when it gets built (I'll be using <ul> and <li>).

When I was debugging and accidentally added a background color to the <li>, is when all hell broke loose. I found at least 30 empty <li> after the visible 7th menu <li>.

Why is this happening?

EDIT:

Here's the loop. The loop creates another object for another function to parse later on. (It creates an <li> with an <a> inside with properties provided by the previous array.) I know that the other function works fine because when I change this "for-in" loop to an ordinary for loop, or while loop, it works fine.

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

解决方案

for in iterates over object properties. Javascript arrays are just a specific kind of object with some handy properties to help you treat them as just arrays, but they still have internal object properties .. and you don't mean to iterate over these).

So, you shouldn't use for in to iterate over arrays. This only became evident to you when you added your background colour, but it'll always be the case.

Instead, loop with a counter and array .length.

这篇关于在＆QUOT;用JavaScript＆QUOT问题;循环的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！