0

I know the classic way of looping through an array arr is:

for(var i=0 ; i<arr.length ; i++) {
    // code
}

But someone recently showed me a different way of implementing the condition inside that loop, like this:

for(var i=0 ; arr[i] !== undefined ; i++) {

I think this solution is interesting because this is exactly what you need when you loop through an array: you don't want to get undefineds when you try to access an undefined index.

I realize that if you count the characters it looks longer, and also that you might have some problems with arrays like this: ["Hello", , "World"], but apart from that - is there anything else I'm missing here? Why shouldn't we be using this technique instead?

Reuven Karasik
  • 475
  • 5
  • 14
  • 3
    Well, yes, it's just a different condition doing different things. – Bergi Mar 23 '15 at 17:52
  • So why don't we use it? How come I've never seen someone do this? – Reuven Karasik Mar 23 '15 at 17:53
  • 1
    It's mostly preference – Sterling Archer Mar 23 '15 at 17:53
  • 1
    Sometimes you have `undefined` stuff in your array, and you wouldn't want that to break the loop. Otherwise I guess that's fine. – Farzher Mar 23 '15 at 17:53
  • 1
    using the second implementation does not ensure that you'll iterate through your whole array contents...however the first does. if you dont want undefineds, you can strip the undefined elements of the array then iterate through the array (in which case both methods would yield the same result) – indubitablee Mar 23 '15 at 17:57
  • 1
    If you're feeling adventurous, ES6 introduces `for... of` for arrays. – ndugger Mar 23 '15 at 18:00

2 Answers2

3

Why shouldn't we be using this technique instead?

  • It doesn't work on sparse arrays (as you mentioned)
  • It doesn't work on arrays that contain undefined values
  • It's not as easily optimised (assuming the .length stays constant during the loop)
  • (In the old days, the undefined identifier could be overwritten, you'd need to use typeof)

Of cource, wheter it "works" for you depends on the use case, and sometimes you might want to use it. Most times, you simply don't.

And even if both ways would work in your case, it's better practise to use the standard approach (i<arr.length) as there is lower mental overhead. Everyone recognises that pattern and knows what it does, while with arr[i]!==undefined one would need to think about why the uncommon approach was chosen.

Community
  • 1
  • 1
Bergi
  • 630,263
  • 148
  • 957
  • 1,375
1

Sometimes arrays have empty values and your way of iteration will fail.

var arr = [];
arr[5] = 5;

for (var i = 0; arr[i] !== undefined; ++i) {
    console.log(arr[i]);
}

console.log('done');

If you want to iterate real array values and skip undefined's, i suggest you to filter the array first and do iteration after. So your code will be more understandable. Example:

var arr = [];
arr[5] = 5;

arr.filter(Boolean).forEach(function (e) {
  console.log(e);
});

console.log('done');