I have a JavaScript object like the following:
var p = {
"p1": "value1",
"p2": "value2",
"p3": "value3"
};
Now I want to loop through all p
elements (p1
, p2
, p3
...) And get their keys and values. How can I do that?
I can modify the JavaScript object if necessary. My ultimate goal is to loop through some key value pairs and if possible I want to avoid using eval
.
I would do this rather than checking
obj.hasOwnerProperty
within everyfor ... in
loop.After looking through all the answers in here, hasOwnProperty isn't required for my own usage because my json object is clean; there's really no sense in adding any additional javascript processing. This is all I'm using:
If you want to iterate only over properties use one of the answers above, however if you want to iterate over everything including functions, then you might want to use Object.getOwnPropertyNames(obj)
I sometimes use this to fast test all functions on objects with simple inputs and outputs.
The question won't be complete if we don't mention about alternative methods for looping through objects.
Nowadays many well known JavaScript libraries provide their own methods for iterating over collections, i.e. over arrays, objects, and array-like objects. These methods are convenient to use and are entirely compatible with any browser.
If you work with jQuery, you may use
jQuery.each()
method. It can be used to seamlessly iterate over both objects and arrays:In Underscore.js you can find method
_.each()
, which iterates over a list of elements, yielding each in turn to a supplied function (pay attention to the order of arguments in iteratee function!):Lo-Dash provides several methods for iterating over object properties. Basic
_.forEach()
(or it's alias_.each()
) is useful for looping through both objects and arrays, however (!) objects withlength
property are treated like arrays, and to avoid this behavior it is suggested to use_.forIn()
and_.forOwn()
methods (these also havevalue
argument coming first):_.forIn()
iterates over own and inherited enumerable properties of an object, while_.forOwn()
iterates only over own properties of an object (basically checking againsthasOwnProperty
function). For simple objects and object literals any of these methods will work fine.Generally all described methods have the same behaviour with any supplied objects. Besides using native
for..in
loop will usually be faster than any abstraction, such asjQuery.each()
, these methods are considerably easier to use, require less coding and provide better error handling.In ECMAScript 5 you have new approach in iteration fields of literal -
Object.keys
More information you can see on MDN
My choice is below as a faster solution in current versions of browsers (Chrome30, IE10, FF25)
You can compare performance of this approach with different implementations on jsperf.com:
Browser support you can see on Kangax's compat table
For old browser you have simple and full polyfill
UPD:
performance comparison for all most popular cases in this question on
perfjs.info
:object literal iteration