CODEWITHSUNDEEP
javascriptarrays
Feinliebe
Feinliebe

Reputation: 75

Complicated array of objects into simple one

My array looks like, but includes 1000+ objects:

data = [
  {
    code: '3019476',
    _id: '60033f61-8a4e-4622-9731-decd07bc44e1',
    vendor: 'DKNY',
    info: ['array of objects'],
    tags: [
      { type: 1, label: 'dsfs' },
      { type: 2, label: 'thisOne' },
      { type: 3, label: 'sdas' },
    ],
  },
];

So I am trying to get is an array of objects, all of which are the same, but each one has one of the tags params.

Expected output:

data = [
  {all data that object that i had contains, but tag is { type: 1, label: 'dsfs' },
  {all data that object that i had contains, but tag is { type: 2, label: 'thisOne' },
  {all data that object that i had contains, but tag is { type: 3, label: 'sdas' }
]

Upvotes: 2

Views: 64

Answers (2)

Nina Scholz
Nina Scholz

Reputation: 386604

You could map the outer and inner array.

const
    data = [{ code: '3019476', _id: '60033f61-8a4e-4622-9731-decd07bc44e1', vendor: 'DKNY', info: ['array of objects'], tags: [{ type: 1, label: 'dsfs' }, { type: 2, label: 'thisOne' }, { type: 3, label: 'sdas' }] }],
    result = data.flatMap(({ tags, ...o }) => tags.map(tag => ({ ...o, tag })));

console.log(result);

Upvotes: 0

Majed Badawi
Majed Badawi

Reputation: 28414

Using .reduce: 

const data = [
  {
    code: '3019476',
    _id: '60033f61-8a4e-4622-9731-decd07bc44e1',
    vendor: 'DKNY',
    info: ['array of objects'],
    tags: [ { type: 1, label: 'dsfs' }, { type: 2, label: 'thisOne' }, { type: 3, label: 'sdas' }  ]
  }
];

// iterate over array items
const res = _.reduce(data, (acc,item) => {
  // get item tags
  const { tags=[] } = item;
  // iterate over tags
  _.forEach(tags, tag => {
    // for each tag, copy the object without the tags list
    const { tags, ...itemDetails } = _.cloneDeep(item);
    // add a new object containing the copied properties excluding tags + current tag
    acc.push({ ...itemDetails, tag })
  });
  return acc;
}, []);

console.log(res);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js" integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"></script>

Using .flatMap:

const data = [
  {
    code: '3019476',
    _id: '60033f61-8a4e-4622-9731-decd07bc44e1',
    vendor: 'DKNY',
    info: ['array of objects'],
    tags: [ { type: 1, label: 'dsfs' }, { type: 2, label: 'thisOne' }, { type: 3, label: 'sdas' }  ]
  }
];

// iterate over array items
const res = _.flatMap(data, item => {
  // get item tags
  const { tags=[] } = item;
  // return list of the object each with different tag
  return _.map(tags, tag => {
    const { tags, ...itemDetails } = _.cloneDeep(item);
    return { ...itemDetails, tag };
  });
});

console.log(res);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js" integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"></script>

Upvotes: 1

Related Questions