I have some javascript as shown below

for (var titleKey in data.d) {
  var title = data.d[titleKey];
}

This is actually ing back from a JQuery call to a .NET webservice but I don't believe that's related.

My loop iterates over each element in the collection correctly, it then continues through the loop one more time. The titleKey here is 'indexof' and title is 'undefined'.

This is happening in two different places in my code.

What is causing this? How can I prevent it?

Thanks in advance.

I have some javascript as shown below

for (var titleKey in data.d) {
  var title = data.d[titleKey];
}

This is actually ing back from a JQuery call to a .NET webservice but I don't believe that's related.

My loop iterates over each element in the collection correctly, it then continues through the loop one more time. The titleKey here is 'indexof' and title is 'undefined'.

This is happening in two different places in my code.

What is causing this? How can I prevent it?

Thanks in advance.

• javascript
• for-loop

• "What is causing this?" What is causing what exactly? You haven't actually explained what the problem is. – spender Commented Nov 24, 2011 at 20:21
• 1 Can you console.log(data.d) and include the output in the question? It'd be helpful to get an idea of what it contains. – davidchambers Commented Nov 24, 2011 at 20:21
• A console of data.d gives: [0]: "Mr" [1]: "Mrs" [2]: "Miss" [3]: "Ms" [4]: "Dr" [5]: "Rev" titleKey goes from 0-5 then 'indexof' – Liath Commented Nov 24, 2011 at 20:25
• 1 Don't use for ... in to iterate over a JavaScript array. Use a standard for loop as suggested in some of the ments below. – davidchambers Commented Nov 24, 2011 at 20:27

5 Answers 5

You need to exclude from the loop the properties of the prototype. The for ... in structure will loop through everything* it finds in the prototype chain, not only the properties of the child object.

for (var titleKey in data.d) {
  if (data.d.hasOwnProperty(titleKey)) {
    // own property //
  }
  else {
    // inherited property //
  }
}

From what the console log says my suspicion is that you have a library that implements the indexof for Array in its prototype.

My remendation would be to use the correct way to walk Arrays:

for (var index = 0; index < data.d.length; index++) {...}

for in is for Objects, not Arrays. This is a mon beginner mistake, where one abuses the fact that Array is derived from Object.

* See ment from davidchambers

Javascript's "for-in" iterates through all properties of an object, and this includes method names.

Use the following loop mechanism:

for (var i = 0; i < titleKey.length; i++) {
  var title = data.d[titleKey[i]];
}

The for:in loop loops through all properties of an object, rather than just ones that are indexable.

If indexof es from the prototype chain, you must use hasOwnProperty to skip over it.

for (var titleKey in data.d) {

    if (data.d.hasOwnProperty(titleKey))
    {
      var title = data.d[titleKey];
    }

}

Based on the information at hand, I'd say that data.d.indexof is in fact undefined. The following is a perfectly valid data structure:

foo: 42
bar: [1, 2, 3]
baz: false
indexof: undefined

As a sanity check, try the following:

console.log(Object.prototype.hasOwnProperty.call(data.d, 'indexof'))

Edit: Now that it has bee clear that the data structure is in fact an array, this answer does not solve the OP's problem. It's still valid, though, so I won't remove it.