Is there a way to solve this problem by using .forEach or .map instead of for-loop?
In some near future maybe you could use Object.fromEntries(). It is supported on some browsers version right now: Browser Compatibility:
var arr = [
[
['firstName', 'Joe'],
['lastName', 'Blow'],
['age', 42],
['role', 'clerk']
],
[
['firstName', 'Mary'],
['lastName', 'Jenkins'],
['age', 36],
['role', 'manager']
]
];
console.log(arr.map(Object.fromEntries));
.as-console {background-color:black !important; color:lime;}
.as-console-wrapper {max-height:100% !important; top:0;}
You could map new objects by mapping the properties and join all properties to a single objects.
var data = [[['firstName', 'Joe'], ['lastName', 'Blow'], ['age', 42], ['role', 'clerk']], [['firstName', 'Mary'], ['lastName', 'Jenkins'], ['age', 36], ['role', 'manager']]],
result = data.map(a => Object.assign(...a.map(([key, value]) => ({ [key]: value }))));
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }