Let me summarise the possibilities. The aim is always to make an array out of the object. There are various Javascript object functions for this. For each individual function, there are different ways of interpreting it. So it always depends on what our object looks like and what we want to do.
In the example above, it is an object with three objects.
const obj = {
a: {value: 1},
b: {value: 2},
c: {value:3}
};
With Object.keys
Object.keys only gives us the keys of the object.
const arr = Object.keys(obj);
// output arr:
[a, b, c]
const result = arr.reduce((total, key) => {
return sum + obj[key].value;
}, 0);
// output result
// 6
With Object.value
Object.value() returns the every single value in an array.
const arr = Object.value(obj);
// output arr
[
{value: 1},
{value: 2},
{value: 3},
]
const result = arr.reduce((total, singleValue) => {
return total + singleValue.value;
}, 0);
// output result
// 6
// Or the short variant
const resultShort = Object.values(obj).reduce((t, n) => t + n.value, 0)
// output resultShort
// 6
With Object.entries
Object.entries splits each individual object value into an array.
const arr = Object.entries(obj)
// output arr
[
["a", {visitors: 1}],
["b", {visitors: 2}],
["c", {visitors: 4}]
]
const result = arr.reduce((total, singleArr) => {
return total + singleArr[1].value;
}, 0);
// output result
// 6
Whether you do it with reduce or with the array function map() depends on you and what you want to do.
