Wednesday, 28 December 2016

How do I loop through or enumerate a JavaScript object?




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.


Answer



You can use the for-in loop as shown by others. However, you also have to make sure that the key you get is an actual property of an object, and doesn't come from the prototype.



Here is the snippet:



var p = {

"p1": "value1",
"p2": "value2",
"p3": "value3"
};

for (var key in p) {
if (p.hasOwnProperty(key)) {
console.log(key + " -> " + p[key]);
}
}






For-of with Object.keys() alternative:





var p = {
0: "value1",

"b": "value2",
key: "value3"
};

for (var key of Object.keys(p)) {
console.log(key + " -> " + p[key])
}






Notice the use of for-of instead of for-in, if not used it will return undefined on named properties, and Object.keys() ensures the use of only the object's own properties without the whole prototype-chain properties


No comments:

Post a Comment

c++ - Does curly brackets matter for empty constructor?

Those brackets declare an empty, inline constructor. In that case, with them, the constructor does exist, it merely does nothing more than t...