Проблемы с JavaScript "для в" цикла - PullRequest
Новая
       21

Проблемы с JavaScript "для в" цикла

0 голосов
/ 07 августа 2011

У меня есть массив объектов, которые будут основой для определенного меню на моем сайте.Он будет построен с использованием 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, чтобы мне не приходилось иметь дело с индексами и длинами.Я ожидаю, что семь пунктов появятся в меню, когда оно будет построено (я буду использовать <ul> и <li>).

Когда я отлаживал и случайно добавил цвет фона к <li>,это когда весь ад вырвался на свободу.Я нашел по крайней мере 30 пустых <li> после видимого 7-го меню <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);
    }
}

Ответы [ 3 ]

9 голосов
/ 07 августа 2011

for in перебирает свойства объекта. Массивы Javascript - это просто особый вид объектов с некоторыми удобными свойствами, которые помогут вам рассматривать их как просто массивы, но у них все еще есть внутренние свойства объекта ... и вы не хотите итерировать по ним).

Итак, вы не должны использовать for in для перебора массивов. Это стало очевидным только после добавления цвета фона, но так будет всегда.

Вместо этого цикл с счетчиком и массивом .length.

2 голосов
/ 07 августа 2011

Ваш объект получает методы и свойства, передаваемые самим 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/

1 голос
/ 07 августа 2011

Я не вижу разницы между двумя способами итерации вашей структуры данных в этом 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++).

Я понимаю соблазнение более простого синтаксиса, но это не правильный способ сделать это.

...