turn a table into an array of objects in JavaScript

Question

I have a table

const header = ["name", "age", "hobby"];
const content = [ ["Eva", 3, "dance"],
                  ["Kevin", 5, "ball"],
                  ...];

How can I get output as an array of objects?

[{name: "Eva", age: 3, hobby: "dance"}, 
 {name: "Kevin", age: 5, hobby: "ball"},
 ...]

By table, you mean an actual HTML table (and that's just your representation of it's content)? — SamVK, Jul 24 '18 at 03:37
The following link may help you : https://stackoverflow.com/questions/12290927/how-to-convert-html-table-to-javascript-object-with-jquery — Nebi Sarikaya, Jul 24 '18 at 04:24

score 1 · Accepted Answer · answered Jul 24 '18 at 03:40

1

Lodash (or underscore.js) library provides some nice functions to transform data. It's just one line:

import _  from 'lodash';
const output = content.map((row) => _.zipObject(row, header));

answered Jul 24 '18 at 03:40

Yixing Liu

2,179
1
20
36

score 1 · Answer 2 · answered Jul 24 '18 at 04:08

You can do like this with javascript :

const header = ["name", "age", "hobby"];
const content = [["Eva", 3, "dance"],
 ["Kevin", 5, "ball"]
];
const result = [];

for (var i = 0; i < content.length; i++) {
 var obj = {};
 for (var j = 0; j < header.length; j++) {
  obj[header[j]] = content[i][j];
 }
 result.push(obj);
}
console.log(result);

score 0 · Answer 3 · answered Jul 24 '18 at 04:17

can be done with map and reduce

const header = ["name", "age", "hobby"];
const content = [
  ["Eva", 3, "dance"],
  ["Kevin", 5, "ball"]
];

console.log(content.map((item) => {
  return header.reduce((acc, cur, i) => {
    acc[cur] = item[i];
    return acc;
  }, {});
}));

turn a table into an array of objects in JavaScript

3 Answers3