I have an array with labels
columns = ["col1", "col2", "col3", "col4"]
and thousands of arrays with values
values = [
['value1','value2','value3','value4'],
['value1','value2','value3','value4'],
['value1','value2','value3','value4'],
// ...
]
I want to iterate the values and create a single array with this structure:
result = [
{ col1: "val1", col2: "val2", col3: "val3", col3: "val4" },
{ col1: "val1", col2: "val2", col3: "val3", col3: "val4" },
{ col1: "val1", col2: "val2", col3: "val3", col3: "val4" },
]
I tried to iterate both and return the object dynamically, but without success:
const columns = ["col1", "col2", "col3", "col4"];
const values = [
['value1','value2','value3','value4'],
['value1','value2','value3','value4'],
['value1','value2','value3','value4'],
];
const lastArr = values.map((e) =>
columns.map((col) => {
return { col: e[0] };
})
);
console.log(lastArr);
// or manually
const raw = values.map(e =>
columns.map(col => {
return {
col1: e[0],
col2: e[1],
col3: e[2],
col4: e[3],
}
})
);
console.log(raw);Neither attempts return the desired result.
You can use Object.fromEntries, like so:
const columns = ["col1", "col2", "col3"];
const values = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9],
[10, 11, 12]
];
const result = values.map(row =>
Object.fromEntries(columns.map((col, i) =>
[col, row[i]]
))
)
console.log(result);It would be more understandable if your examples were more consistent and the values were a bit more distinguishable but this should do the trick
values.map(v => Object.fromEntries(columns.map((c,i) => [c, v[i]])));
Combination of map and reduce can help here.
const lastArr = this.rawData.map((row) => {
const colsMap = cols.map((col, index) => {
return { [col]: row[index] };
});
return colsMap.reduce((acc, curr) => { ...acc, curr }, {});
});