Is using for ...of for arrays ok?

Question

Now we have a for... of loop in JS. Can it be used for iteration over arrays instead of for (let i = 0, len = array.length; i < len; i++) {...} seamlessly or are there any caveats that make using it for arrays a bad practice?

@Claies Please, read thoroughly before you vote down. It's about for... of but not for... in — tristantzara, Oct 16 '16 at 20:08
I didn't vote down, but I accidentally linked the wrong duplicate. I retracted the duplicate and can't now put the correct one in, but I still think this is something commonly enough asked that this question in particular doesn't provide much context useful to others. — Claies, Oct 16 '16 at 20:10
The [MDN Documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of) doesn't mention any caveats regarding arrays (and most of the examples are using them as well) — UnholySheep, Oct 16 '16 at 20:11
@Claies as a user who has respect to other users I've searched before posting and didn't find an appropriate answer, so I've posted. Cheers. — tristantzara, Oct 16 '16 at 20:11
@UnholySheep yep, I've read it, but why I've asked it here is to hear about using it in everyday practice this way. Nevertheless docs are great, it's a bit different thing. — tristantzara, Oct 16 '16 at 20:13
perhaps maybe http://stackoverflow.com/questions/31344516/are-there-reasons-to-use-array-foreach-over-for-of-when-both-could-be-used not quite the same, but these are all overlapping concepts. — Claies, Oct 16 '16 at 20:13
@Claies it says `for...of is very useful with iterable objects, but not always the best choice for arrays.` My question asks for particular caveats. I guess it might be useful — tristantzara, Oct 16 '16 at 20:14
Maybe this might peek your interest, [forEach()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach) — Matthew, Oct 16 '16 at 20:20

score 2 · Answer 1 · answered Oct 16 '16 at 20:21

Yes, it's OK.

Well, unless you specified a custom value for Symbol.iterator, but still want the loop to be from 0 to length.

var arr = [1,2,3,4];
arr[Symbol.iterator] = function*() {
  yield "custom";
  yield "iterator";
};

console.log('Old for loop:');
for (let i = 0; i < arr.length; i++) console.log('    ', arr[i]);

console.log('New for-of loop:');
for (let item of arr) console.log('    ', item);

score 1 · Accepted Answer · answered Oct 16 '16 at 20:18

Yes, for... of is fine for Arrays because they are iterable.

You can verify that in your browser's console by checking that Array instances have a Symbol.iterator method:

[][Symbol.iterator]
> values() { [native code] }

... and, tautologically, by the fact that you can iterate them with for... of!

score 0 · Answer 3 · answered Oct 16 '16 at 20:16

0

In my opinion the main purpose of for-of loops is to iterate arrays. The fact that iterating arrays using for-in loops is considered a bad practice has nothing to do with it. Also, for-in loop can be used for iterating any objects, but for-of loop can be used only for iterating objects that are iterable.

answered Oct 16 '16 at 20:16

Michał Perłakowski

88,409
26
156
177

thanks.I use for... of with generators but I would like to hear some feedback about using it for arrays, particularly arrays, can I just be confident and iterate over arrays with it, or maybe there're some edge cases which could be an unpleasant surprise – tristantzara Oct 16 '16 at 20:18
@TristanTzara Yes, you can be confident that it will work perfectly fine with arrays. There aren't any edge cases—it behaves exactly as a regular for loop. – Michał Perłakowski Oct 16 '16 at 20:20
2

You can always produce an edge case, e.g. a subclass of arrays that overwrites the iteration protocol to do something different than you expect, but that's pretty much true for every iteration method. – Bergi Oct 16 '16 at 20:22
FWIW you can break `for(;;)` loops and `forEach` etc by changing your array's `length`. – joews Oct 16 '16 at 20:27
@joews How exactly? The `length` property can only be a number. If you set it to a number greater than the current length, it's the same as adding `undefined` elements to the end of the array. If you set it to a number smaller than the current length, it's the same as removing elements from the end of the array. It's not possible for example to have 10 elements in an array and the value of the `length` property equal to 5. – Michał Perłakowski Oct 16 '16 at 20:40

Is using for ...of for arrays ok?

3 Answers3