Is it fine to use Array.prototype.forEach in a loop?

Question

JSHint is complaining at me because I'm looping over an object using for(o in ...), then using a o.somearray.forEach(function(){...}); inside. It's saying to not create functions within loops, but does it even matter in this case? It looks a bit nicer since there's less lines and it looks (slightly) better, but are there any major implications from it?

Is it any better to use a normal for-loop and iterate over the array like that, or is it fine to create a function and use the ECMA 5 version?

I'm doing something like this:

for(var i in data) {
   data[i].arr.forEach(function(...) {
      // do magic
   });
}

Answer 1

It is fine to use forEach, what it is suggesting here is that the function that you are passing to forEach should be created outside of the loop, something like the following:

var doMagic = function(...) {
    // do magic
};
for (var i in data) {
    data[i].arr.forEach(doMagic);
}

Creating functions within a loop is discouraged because it is inefficient, the JavaScript interpreter will create an instance of the function per loop iteration. Additional details are provided in JSLint Error Explanations: Don't make functions within a loop.

Answer 2

Yes, it's fine to nest the constructs. It's also fine to create a "new" function each loop. And,

Performance differences when creating many "new" functions within the same execution context is an implementation detail; but it is not inherently slower. (See this jsperf test case¹)

Even though a new function-object will be created in the "new" case each loop the same number of execution contexts are created - namely, the current execution context and when the function is called. Smarter JavaScript implementations can trivially take advantage of this; or they may not.

I prefer the inline-method in this particular case.

---

¹ Test on the particular JavaScript implementation of course;

• In IE 10, Chrome 33, and FF 23 show equivalent performance
• FF 27 favors the "new" function case
• Safari 5 buggers the numbers and runs slower in the "new" case