Using lodash to modify object

Question

I am trying to transform an array of objects (aka initial objects) into an array with the objects re arranged.
Basically I want to create an array which contains a new object. This new object has at level zero, some property of the initial objects and a nested array that contains other value from the same initial objects
To do so, I am using lodash but I am missing something.
My initial array
  const myArray = {
    ages: [
      {
        maxAge: 32,
        minAge: 20,
        name: "20-32",
        percent: 20,
        quotaGroupName: "Age"
      },
      {
        maxAge: 40,
        minAge: 33,
        name: "33-40",
        percent: 50,
        quotaGroupName: "Age"
      }
    ],
    genders: [
      {
        gender: 1
        name: "Male"
        percent: 40
        quotaGroupName: "Gender"
      },
      {
        gender: 2
        name: "Female"
        percent: 60
        quotaGroupName: "Gender"
      },
    ]
    }

I would like to obtain something like:
  groups: [
    {
      groupType: "Age", // quotaGroupName
      quotas: [
        {
          name: "20-32",
          percent: 20,
          targetGroup: {
            minAge: 20,
            maxAge: 32,
          }
        },
        {
          name: "33-40",
          percent: 50,
          targetGroup: {
            minAge: 40,
            maxAge: 30,
          }
        }
      ]
    },
    {
      groupType: "Gender", // quotaGroupName
      quotas: [
        {
          name: "Male",
          percent: 20,
          targetGroup: {
            variableIds: [1], // gender
          }
        },
        {
          name: "Female",
          percent: 50,
          targetGroup: {
            variableIds: [2], // gender
          }
        }
      ]
    }
  ]

I am trying with:
  _.chain(data)
    .groupBy("groupType")
    .map((value, key) => (something))
    .value()

but I am really stuck and not sure how to proceede

Victoria Iashchuk · Answer

You can do it using lodash:
_.chain(myArray)
  .map((items, key) => ({
    groupType: _.get(_.first(items), 'quotaGroupName'),
    quotas: _.map(items, item => {
      return _.assign(_.pick(item, ['name', 'percent']), {
        targetGroup: key === 'genders' ? {variableIds: [item.gender]} : 
        _.omit(item, ['name', 'percent'])
      })
    })
  }))

Ruben Helsloot · Answer

Remember that with ES6, most times you actually don't need Lodash! I wrote a function getTargetGroup that you can make as complicated as you want to suit your use case, but otherwise, this should suit your needs.

const myData = {
    ages: [{
        maxAge: 32,
        minAge: 20,
        name: "20-32",
        percent: 20,
        quotaGroupName: "Age",
    },
        {
            maxAge: 40,
            minAge: 33,
            name: "33-40",
            percent: 50,
            quotaGroupName: "Age",
        },
    ],
    genders: [{
        gender: 1,
        name: "Male",
        percent: 40,
        quotaGroupName: "Gender",
    },
        {
            gender: 2,
            name: "Female",
            percent: 60,
            quotaGroupName: "Gender",
        },
    ],
};

const getTargetGroup = (item) => {
  if (item.minAge !== undefined && item.maxAge !== undefined) {
    return { minAge: item.minAge, maxAge: item.maxAge };
  }
  
  return {variableIds: [item.gender]};
};

const result = {
    groups: Object
        .values(myData)
        // First `items` === `myData.ages`
        .map((items) => ({
            groupType: items[0].quotaGroupName,
            // First `item` === `myData.ages[0]`
            quotas: items.map((item) => ({
                name: item.name,
                percent: item.percent,
                targetGroup: getTargetGroup(item),
            })),
        })),
};

console.log(result);
document.getElementById('actual').innerHTML = JSON.stringify(result);

<code id="expected">
groups: [
    {
      groupType: "Age",
      quotas: [
        {
          name: "20-32",
          percent: 20,
          targetGroup: {
            minAge: 20,
            maxAge: 32,
          }
        },
        {
          name: "33-40",
          percent: 50,
          targetGroup: {
            minAge: 40,
            maxAge: 30,
          }
        }
      ]
    },
    {
      groupType: "Gender",
      quotas: [
        {
          name: "Male",
          percent: 20,
          targetGroup: {
            variableIds: [1],
          }
        },
        {
          name: "Female",
          percent: 50,
          targetGroup: {
            variableIds: [2],
          }
        }
      ]
    }
</code>
<hr>
<code id="actual">
</code>


groups: [
    {
      groupType: "Age",
      quotas: [
        {
          name: "20-32",
          percent: 20,
          targetGroup: {
            minAge: 20,
            maxAge: 32,
          }
        },
        {
          name: "33-40",
          percent: 50,
          targetGroup: {
            minAge: 40,
            maxAge: 30,
          }
        }
      ]
    },
    {
      groupType: "Gender",
      quotas: [
        {
          name: "Male",
          percent: 20,
          targetGroup: {
            variableIds: [1],
          }
        },
        {
          name: "Female",
          percent: 50,
          targetGroup: {
            variableIds: [2],
          }
        }
      ]
    }

Using lodash to modify object

2 Answers

Add your own answers!

Ask a Question