javascript - Can I use "map" as a substitute for "for each""for in"? - Sta

admin管理员组

文章数量:1323529

For a little while now javascript has the "map" function to loop over arrays.

It appears possible to use it as a 'foreach' operator for example:

fruitbowl.map(function(fruit){ 
                  ... do stuff with fruit
              })

Is this better or worse than saying

for(var i in fruitbowl){ 
     ... do stuff with fruitbowl[i] 
}

Saves having to use the index but adds a callback; it doesn't seem very mon so I hesitate to use it but still want to.

For a little while now javascript has the "map" function to loop over arrays.

It appears possible to use it as a 'foreach' operator for example:

fruitbowl.map(function(fruit){ 
                  ... do stuff with fruit
              })

Is this better or worse than saying

for(var i in fruitbowl){ 
     ... do stuff with fruitbowl[i] 
}

Saves having to use the index but adds a callback; it doesn't seem very mon so I hesitate to use it but still want to.

• javascript
• arrays
• loops

Share Improve this question Follow edited Apr 23, 2010 at 13:42 John Mee asked Apr 23, 2010 at 4:54 John MeeJohn Mee 52.3k3838 gold badges156156 silver badges196196 bronze badges 4

• I wonder what browser support is like? – Matthew Lock Commented Apr 23, 2010 at 5:12
• 1 Browser support is the question. "Map" needs 1.5, "forEach" needs 1.6. I'm seeing a rule-of-thumb forming: Map when assigning, forEach when processing, and for-in when legacy. – John Mee Commented Apr 23, 2010 at 5:26
• For browser support, give a look to this: ES5 Compatibility Table. – Christian C. Salvadó Commented Apr 23, 2010 at 5:55
• 1 oh, ffs, not supported by msie. That's why it's so unmon. But the routines provided in the reference at Mozilla save the day. – John Mee Commented Apr 23, 2010 at 14:04

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 7

The three methods you mention have different purposes.

The purpose of the Array.prototype.map method is to create a new array with the results of calling the callback function on every array element.

The purpose of the Array.prototype.forEach method is to iterate over an array, executing the provided callback function once per array element.

The purpose of the for...in statement is to enumerate object properties.

I think that the for...in statement should be avoided to traverse any array-like¹ object, where the real purpose is iterate over numeric indexes and not enumerate the object properties (even knowing that those indexes are properties).

Reasons to avoid for...in to iterate array-like objects:

• Iterates over inherited user-defined properties in addition to the array elements, if you use a library like MooTools for example, which extend the Array.prototype object, you will see all those extended properties.
• The order of iteration is arbitrary, the elements may not be visited in numeric order.

Give a look to this article:

• Iteration VS Enumeration

---

₁ By array-like objects I mean any object that contains sequential numeric properties, and a length property

That use is considered valid, but it's bad style to use a map operation strictly for its side effects instead.

Readability is worth a lot. The map might be confusing to those who've never seen it used this way. It violates the "principle of least surprise."

In Perl, map is used similarly but more naturally.

My rule of thumb is if it does not read better than a loop then don't use it. Difficult to debug. But for certain functions, map is more natural than a loop. If you need to scratch your head over it -- don't do it. Pity the guy who follows you, including yourself sometime from now!

Don't use map for its side effects. If your task is iterating over an array to do something with each object, use foreach. If you are mapping values, e.g. escaping an array of strings, use map. There's nothing like clarity and programmer intent over being clever.

本文标签： javascriptCan I use quotmapquot as a substitute for quotfor eachquotquotfor inquotStack Overflow