Get all values of a nested JSON object using any lodash
10,381
Solution 1
As you've underscore.js, lodash included, why not taking advantage of them instead of reinventing the wheel.
How about single-line using _.map
. _.map
also accepts strings as iteratee and will return the value of that key from the passed object.
_.map(json.order.orderDetails, 'a1')
var json = {
"order": {
"orderDetails": [{
"a1": "b1",
"c1": "d1",
"e1": "f1"
}, {
"a1": "b2",
"c1": "d2",
"e1": "f2"
}, {
"a1": "b3",
"c1": "d3",
"e1": "f3"
}],
"orderHeader": [{
"a2": "b1",
"c2": "d1",
"e2": "f1"
}, {
"a2": "b2",
"c2": "d2",
"e2": "f2"
}]
}
};
var result = _.map(json.order.orderDetails, 'a1');
console.log(result);
document.getElementById('result').innerHTML = JSON.stringify(result, 0, 4); // For Demo: Showing the result on the screen
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.0.0/lodash.js"></script>
<pre id="result"></pre>
This is similar to _.pluck
in older versions of lodash.
_.pluck(json.order.orderDetails, 'a1')
The same result can be achieved in pure JavaScript using Array#map
json.order.orderDetails.map(e => e.a1)
var json = {
"order": {
"orderDetails": [{
"a1": "b1",
"c1": "d1",
"e1": "f1"
}, {
"a1": "b2",
"c1": "d2",
"e1": "f2"
}, {
"a1": "b3",
"c1": "d3",
"e1": "f3"
}],
"orderHeader": [{
"a2": "b1",
"c2": "d1",
"e2": "f1"
}, {
"a2": "b2",
"c2": "d2",
"e2": "f2"
}]
}
};
var result = json.order.orderDetails.map(e => e.a1);
console.log(result);
document.getElementById('result').innerHTML = JSON.stringify(result, 0, 4);
<pre id="result"></pre>
Solution 2
You can use this code to do so.
var json={
"order": {
"orderDetails": [
{
"a1": "b1",
"c1": "d1",
"e1": "f1"
},
{
"a1": "b2",
"c1": "d2",
"e1": "f2"
},
{
"a1": "b3",
"c1": "d3",
"e1": "f3"
}
],
"orderHeader": [
{
"a2": "b1",
"c2": "d1",
"e2": "f1"
},
{
"a2": "b2",
"c2": "d2",
"e2": "f2"
}
]
}
}
var a1 = json.order.orderDetails.map(function(obj){ return obj.a1 });
console.log(a1);
Solution 3
You can try something like this:
var json = {
"order": {
"orderDetails": [{
"a1": "b1",
"c1": "d1",
"e1": "f1"
}, {
"a1": "b2",
"c1": "d2",
"e1": "f2"
}, {
"a1": "b3",
"c1": "d3",
"e1": "f3"
}],
"orderHeader": [{
"a2": "b1",
"c2": "d1",
"e2": "f1"
}, {
"a2": "b2",
"c2": "d2",
"e2": "f2"
}]
}
}
var result = {};
// Loop over props of "order"
for (var order in json.order){
// Each prop is array. Loop over them
json.order[order].forEach(function(item) {
// Loop over each object's prop
for (var key in item) {
// Check if result has a prop with key. If not initialize it.
if (!result[key])
result[key] = [];
// Push vaues to necessary array
result[key].push(item[key]);
}
})
};
console.log(result);
Author by
Jibin TJ
Updated on June 09, 2022Comments
-
Jibin TJ almost 2 years
Scenario: I have a variable JSON
var json = { "order": { "orderDetails": [{ "a1": "b1", "c1": "d1", "e1": "f1" }, { "a1": "b2", "c1": "d2", "e1": "f2" }, { "a1": "b3", "c1": "d3", "e1": "f3" }], "orderHeader": [{ "a2": "b1", "c2": "d1", "e2": "f1" }, { "a2": "b2", "c2": "d2", "e2": "f2" }] } };
I need to get an array of all the values of
order.orderdetails.a1
like['b1', 'b2', 'b3']