Update Ugly Object Keys Using Another Array

Question

Below array is called Data, it's array of objects with keys like "marketValue"

Below array is called Columns, it's array of objects with each has Header (Pretty name for columns) and id (Ugly name for columns)

How to scroll through Data and update all ugly keys like this "marketValue" to "Market Value" using columns array?

This is how far I got, but it doesn't work, it returns undefined for every singe row:

 let PrettyData = Data.map((row) =>
    Object.entries(row).forEach(
      (key) => {
        let newKey = columns.filter((colRow) => colRow.id === key[0]);
        let obj = {newKey: key[1]}
        return obj;
      }
    )
  );

forEach is not meant to return anything. In fact, it doesn't return obj. If you're planning to alter the row object, you should not map it. map method is meant to be used with a return statement. — briosheje
– briosheje, Commented May 15, 2020 at 15:30

Alboman · Accepted Answer · 2020-05-15 15:56:18Z

If I understand correctly, you want to update the the keys of each object in data with the Header value of that columns object. This should do it:

const prettyMapping = {};
columns.forEach((column)=>{
    prettyMapping[column.id] = column.Header
});
const PrettyData = Data.map((row)=>{
    const prettyRow = {};
    Object.keys(row).forEach((column)=>{
        prettyRow[prettyMapping[column]] = row[column]
    });
    return prettyRow
});

Go through the columns and create a mapping of header to id.
Map over the rows. Map will create a new array with whatever is returned from each original row iteration
In each row iteration, create the newly formatted row using our mapping from before.

For this case:

const Data = [{qty:1, mp:2}, {qty:1, mp:2, mv:2}];
const columns = [{id:"qty",Header:'Quantity'}, {id:"mv",Header:'Market Value'}, {id:"mp",Header:'Market Price'}]

The above code returns:

[ { Quantity: 1, 'Market Price': 2 },
  { Quantity: 1, 'Market Price': 2, 'Market Value': 2 } ]

Hope this helps!

Collectives™ on Stack Overflow

Update Ugly Object Keys Using Another Array

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related