Question 161494 in Javascript Question posted in
A very good W3school tutorial can be found here.

How to convert obj arr to 2d arr in JS?

let th = ['name', 'id', 'class']
    
    let arr = [
    { 'name' : 'a', 'class':'7', 'id':'1' },
    { 'name' : 'b', 'class':'7', 'id':'2' },
    { 'name' : 'b', 'class':'7', 'id':'3' },
    { 'name' : 'd', 'class':'7', 'id':'4' }
    ]
    
    /* final array what is look like */
    
    let finalArr = [
      ['a', '1', '7'],
      ['b', '2', '7'],
      ['c', '3', '7'],
      ['d', '4', '7']
    ]

How can I create this array without using foreach map? This is a sample data, but in real time there are more than 10k data at a time so foreach is not a good option.

Tags:

2

Answers


  1. 0

    You have a typo in the third row, fixed here:

    let th = ['name', 'id', 'class'];

let arr = [
    { 'name': 'a', 'class': '7', 'id': '1' },
    { 'name': 'b', 'class': '7', 'id': '2' },
    { 'name': 'c', 'class': '7', 'id': '3' },
    { 'name': 'd', 'class': '7', 'id': '4' }
];

const transformedArr = arr.map(row => th.map(name => row[name]));
console.log(transformedArr);

    A potentially faster one, but actually slower up to 2x times than the above solution (tested in node.js / Chrome with 40000000 items in the arr, in Firefox seems the same, but it hangs on that amount of data):

    let th = ['name', 'id', 'class'];

let arr = [
    { 'name': 'a', 'class': '7', 'id': '1' },
    { 'name': 'b', 'class': '7', 'id': '2' },
    { 'name': 'c', 'class': '7', 'id': '3' },
    { 'name': 'd', 'class': '7', 'id': '4' }
];

const transformedArr = [];

for (let i = 0; i < arr.length; i++) {
    const item = [];
    for (let j = 0; j < th.length; j++) {
        item.push(arr[i][th[j]]);
    }
    transformedArr.push(item);
}

console.log(transformedArr);
    Login or Signup to reply.
  2. 0

    You may be surprised by the performance of Array.map/Array.forEach (especially map). Here are performance tests for different approaches:

    const arr4Test = [...Array(10000)].map((_, i) => ({name: `a`, class: 1, id: i}));
let finalArr = [];

// for ... of
let perf = performance.now();
for (let obj of arr4Test) {
  finalArr.push(Object.values(obj));
}
perf = (performance.now() - perf).toFixed(5);
console.log(`for ... of ${JSON.stringify(finalArr.slice(0, 3))} ... ${perf}Ms`);

// classic loop
perf = performance.now();
finalArr.length = 0;
for (let i = 0; i < arr4Test.length; i += 1) {
  let tmpArr = [];
  
  for (let key in arr4Test[i]) {
    tmpArr.push(arr4Test[i][key])
  }
  
  finalArr.push(tmpArr);
}

perf = (performance.now() - perf).toFixed(5);
console.log(`classic loop ${JSON.stringify(finalArr.slice(0, 3))} ... ${perf}Ms`);

// map
perf = performance.now();
finalArr = arr4Test.map(Object.values);
perf = (performance.now() - perf).toFixed(5);
console.log(`map => ${JSON.stringify(finalArr.slice(0, 3))} ... ${perf}Ms`);

// forEach
finalArr.length = 0;
perf = performance.now();
arr4Test.forEach(v => finalArr.push(Object.values(v)));
perf = (performance.now() - perf).toFixed(5);
console.log(`forEach => ${JSON.stringify(finalArr.slice(0, 3))} ... ${perf}Ms`);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search