CODEWITHSUNDEEP
javascript
proph3t
proph3t

Reputation: 965

Javascript - Update Object Keys Based Another Object's Value Mapping

I am working with two objects, data and map, in which I need to update the keys of the data object with the text value of the map object based on the key of data matching the value of the datafield key within the map object.

data = [{
  1230c9299007b07bf73bb396: "Current",
  5900c9299007b07bf73bb3a0: "Will",
  5900c9299007b07bf73bb39f: "Johnson"
}, {
  1230c9299007b07bf73bb396: "Current",
  5900c9299007b07bf73bb3a0: "Donna",
  5900c9299007b07bf73bb39f: "Sampson"
}, {
  1230c9299007b07bf73bb396: "Past",
  5900c9299007b07bf73bb3a0: "Frank",
  5900c9299007b07bf73bb39f: "Lloyd"
}];

map = [{
  dataField: "1230c9299007b07bf73bb396",
  text: "Customer Type"
}, {
  dataField: "5900c9299007b07bf73bb3a0",
  text: "First Name"
}, {
  dataField: "5900c9299007b07bf73bb39f",
  text: "Last Name"
}];

Expected result:

result = [{
  "Customer Type": "Current",
  "First Name": "Will",
  "Last Name": "Johnson"
}, {
  "Customer Type": "Current",
  "First Name": "Donna",
  "Last Name": "Sampson"
}, {
  "Customer Type": "Past",
  "First Name": "Frank",
  "Last Name": "Lloyd"
}];

I have attempted with the following code only to find the two objects merge and do not update any of the object keys as expected:

let items = Object.keys(data).map((key) => {
  const newKey = map[key] || key;
  return { [newKey] : data[key] };
});

Upvotes: 0

Views: 927

Answers (3)

theAlexandrian
theAlexandrian

Reputation: 908

Voilà.

var data = [{
  "1230c9299007b07bf73bb396": "Current",
  "5900c9299007b07bf73bb3a0": "Will",
  "5900c9299007b07bf73bb39f": "Johnson"
}, {
  "1230c9299007b07bf73bb396": "Current",
  "5900c9299007b07bf73bb3a0": "Donna",
  "5900c9299007b07bf73bb39f": "Sampson"
}, {
  "1230c9299007b07bf73bb396": "Past",
  "5900c9299007b07bf73bb3a0": "Frank",
  "5900c9299007b07bf73bb39f": "Lloyd"
}];

var map = [{
  dataField: "1230c9299007b07bf73bb396",
  text: "Customer Type"
}, {
  dataField: "5900c9299007b07bf73bb3a0",
  text: "First Name"
}, {
  dataField: "5900c9299007b07bf73bb39f",
  text: "Last Name"
}];  


let items = data.map(object => {
  let newObj = {};
  map.forEach(prop => newObj[prop.text] = object[prop.dataField]);
  return newObj;
});

console.log(items);

Hope it answers

Upvotes: 3

Jonas Wilms
Jonas Wilms

Reputation: 138437

At first build up a number - key map:

  const keys = new Map(map.map({dataField, text}) => ([dataField, text])));

Now you can map every data entry to a new object by iterating over all the key value pairs abd building new objects:

  const result = data.map(obj => {
    const tmp = {};
    for(const [key, value] of Object.entries(obj)){
      tmp[keys.get(key) || "_"] = value;
    }
    return tmp;
 });

Upvotes: 0

oniondomes
oniondomes

Reputation: 2063

Here you go:

const pre = document.getElementById('pre');

const data = [{
    '1230c9299007b07bf73bb396': "Current",
    '5900c9299007b07bf73bb3a0': "Will",
    '5900c9299007b07bf73bb39f': "Johnson"
  },
  {
    '1230c9299007b07bf73bb396': "Current",
    '5900c9299007b07bf73bb3a0': "Donna",
    '5900c9299007b07bf73bb39f': "Sampson"
  },
  {
    '1230c9299007b07bf73bb396': "Past",
    '5900c9299007b07bf73bb3a0': "Frank",
    '5900c9299007b07bf73bb39f': "Lloyd"
  }
];

const map = [{
  dataField: "1230c9299007b07bf73bb396",
  text: "Customer Type"
}, {
  dataField: "5900c9299007b07bf73bb3a0",
  text: "First Name"
}, {
  dataField: "5900c9299007b07bf73bb39f",
  text: "Last Name"
}];

const fieldToText = map.reduce((result, el) => {
  result[el.dataField] = el.text;
  return result
}, []);

const result = data.map((el) => {
  return Object.entries(el).reduce((result, [key, value]) => {
    result[fieldToText[key]] = value;
    return result;
  }, {});
});

pre.innerHTML = JSON.stringify(result, null, 2);
<pre id="pre"></pre>

https://jsfiddle.net/oniondomes/gqgkroux/

Upvotes: 2

Related Questions