How To Split A Repetitive Array of Objects

Question

I need help in breaking this array of Object into a distinct arrays based on the repeated objects.

The original array is as follows:

const originalArray = {
 Rows: [
  {
   RowValue: [
    {
     FieldIndex: '1',
     Value: 'Sample Item One'
    },
    {
     FieldIndex: '2',
     Value: 'Sample Item Two'
    },
    {
     FieldIndex: '3',
     Value: 'Sample Item Three'
    },
    {
     FieldIndex: '4',
     Value: 'Sample Item Four'
    },
    {
     FieldIndex: '1',
     Value: 'Another Sample Item One'
    },
    {
     FieldIndex: '2',
     Value: 'Another Sample Item Two'
    },
    { 
     FieldIndex: '3',
     Value: 'Another Sample Item Three'
    },
    {
     FieldIndex: '4',
     Value: 'Another Sample Item Four'
    },
   ]
  },
  {
   RowValue: [
    {
     FieldIndex: '1',
     Value: 'Sample Object One'
    },
    {
     FieldIndex: '2',
     Value: 'Sample Object Two'
    },
    {
     FieldIndex: '3',
     Value: 'Sample Object Three'
    },
    {
     FieldIndex: '4',
     Value: 'Sample Object Four'
    },
    {
     FieldIndex: '1',
     Value: 'Another Sample Object One'
    },
    {
     FieldIndex: '2',
     Value: 'Another Sample Object Two'
    },
    { 
     FieldIndex: '3',
     Value: 'Another Sample Object Three'
    },
    {
     FieldIndex: '4',
     Value: 'Another Sample Object Four'
    },
   ]
  }
 ]
}

I will like to have the result look like this

const originalArray = {
 Rows: [
  {
   RowValue: [
    {
     FieldIndex: '1',
     Value: 'Sample Item One'
    },
    {
     FieldIndex: '2',
     Value: 'Sample Item Two'
    },
    {
     FieldIndex: '3',
     Value: 'Sample Item Three'
    },
    {
     FieldIndex: '4',
     Value: 'Sample Item Four'
    }
   ]
  },
  {
   RowValue: [
    {
     FieldIndex: '1',
     Value: 'Another Sample Item One'
    },
    {
     FieldIndex: '2',
     Value: 'Another Sample Item Two'
    },
    { 
     FieldIndex: '3',
     Value: 'Another Sample Item Three'
    },
    {
     FieldIndex: '4',
     Value: 'Another Sample Item Four'
    },
   ]
  },
  {
   RowValue: [
    {
     FieldIndex: '1',
     Value: 'Sample Object One'
    },
    {
     FieldIndex: '2',
     Value: 'Sample Object Two'
    },
    {
     FieldIndex: '3',
     Value: 'Sample Object Three'
    },
    {
     FieldIndex: '4',
     Value: 'Sample Object Four'
    }
   ]
  },
  {
   RowValue: [
    {
     FieldIndex: '1',
     Value: 'Another Sample Object One'
    },
    {
     FieldIndex: '2',
     Value: 'Another Sample Object Two'
    },
    { 
     FieldIndex: '3',
     Value: 'Another Sample Object Three'
    },
    {
     FieldIndex: '4',
     Value: 'Another Sample Object Four'
    },
   ]
  }
 ]
}

This is what I did, but I could not make it repeat the objects as expected;

const splitGridRows = (gridRows) => {
  const newRows = [];

  gridRows.forEach((gridRow) => {
    let newGridRow = {};
    let newRowValue = [];

    gridRow.RowValue.forEach((valueObj) => {
      const hasFieldData = newRowValue.find(
        (rValue) => rValue.FieldIndex === valueObj.FieldIndex
      );

      if (!hasFieldData) {
        newRowValue.push(valueObj);
        newGridRow = { RowValue: newRowValue };
      }
    });

    newRows.push(newGridRow);
  });

  return newRows;
};

Can someone please help me? Thanks in anticipation.

looks like just a [groupby](https://stackoverflow.com/questions/31688459/group-array-items-using-object) on a substring of `value` — pilchard, Mar 13 '23 at 22:35
Can you explain the logic behind the final grouping? This may help you correct your own approach, and is likely to help those that might wish to help write an answer. — David Thomas, Mar 13 '23 at 23:10

Andrew Parks · Accepted Answer · 2023-03-13T23:15:12.490

First, flatten out the structure to get all row elements. Then, use reduce to create an array of arrays (where the inner arrays contain the row elements). Create a new inner array if we discover that the most recent inner array already has an entry for a particular FieldIndex. Then map the result to the desired object structure.

const arr= {"Rows":[{"RowValue":[{"FieldIndex":"1","Value":"Sample Item One"},{"FieldIndex":"2","Value":"Sample Item Two"},{"FieldIndex":"3","Value":"Sample Item Three"},{"FieldIndex":"4","Value":"Sample Item Four"},{"FieldIndex":"1","Value":"Another Sample Item One"},{"FieldIndex":"2","Value":"Another Sample Item Two"},{"FieldIndex":"3","Value":"Another Sample Item Three"},{"FieldIndex":"4","Value":"Another Sample Item Four"}]},{"RowValue":[{"FieldIndex":"1","Value":"Sample Object One"},{"FieldIndex":"2","Value":"Sample Object Two"},{"FieldIndex":"3","Value":"Sample Object Three"},{"FieldIndex":"4","Value":"Sample Object Four"},{"FieldIndex":"1","Value":"Another Sample Object One"},{"FieldIndex":"2","Value":"Another Sample Object Two"},{"FieldIndex":"3","Value":"Another Sample Object Three"},{"FieldIndex":"4","Value":"Another Sample Object Four"}]}]}

const r = {
  Rows: arr.Rows.flatMap(i => i.RowValue).reduce((a,c,t) => (
      t = a[a.length-1],
      t.some(i => i.FieldIndex === c.FieldIndex) && a.push(t=[]),
      t.push(c),
      a
    ), [[]]
  ).map(a=>({RowValue:a}))
}

console.log(r)

Formatting your code would be helpful for beginners to read the code without feeling overwhelmed — Viraj Shah, Mar 13 '23 at 23:11

How To Split A Repetitive Array of Objects

1 Answers1