I am trying to achieve the below:
var arr = [
{name: 'width', value: 10},
{name: 'height', value: 20},
]
arr.reduce((ack, item)=>{
ack.width = item.value
ack.height = item.value
return ack
},{})
//Expected output:
{width: 10, height: 20}
//Actual output:
{width: 20, height: 20}
Maybe I don't understand how .reduce() works a 100%?
You need to take name as key.
const
array = [{ name: 'width', value: 10 }, { name: 'height', value: 20 }],
result = array.reduce(
(object, { name, value }) => ({ ...object, [name]: value }),
{}
);
console.log(result);reduce method executes a callback function on each element of the array, so in your issue, on every iteration you have an object that contains name and value property. you can achieve your goal like this:
let arr = [
{name: 'width', value: 10},
{name: 'height', value: 20},
]
let result = arr.reduce((ack, item)=>{
ack[item.name] = item.value
return ack
},{})
console.log(result);Maybe I don't understand how .reduce() works a 100%?
Appears so. Read the docs
Every time the reducer function is called - ack is what was returned last time from the reducer (or the initial value if it's the first pass) and item is the current item.
It helps to do this:
arr.reduce((ack, item)=>{
console.log(ack); // this will help you understand
ack[item.name] = ack[item.value]
return ack
},{})