JS: slice a nested array in array of objects by index

Question

The task is to slice a nested array by data property. I have the following array structure:

  const mockData = [
    {
      text: 'Text1',
      data: [
        { field: '1' },
        { field: '2' },
        { field: '3' },
        { field: '4' },
        { field: '5' },
        { field: '6' }
      ]
    },
    {
      text: 'Text2',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }, { field: '4' }]
    }
  ];

Here's the method I use:

const sliceArray = mockData => mockData.map(d => ({...d, data: d.data.slice(0, 3)}))

It goes through all nested objects and slice array by data property, but how can I do it for a specific nested object instead of all of them? I'd like to use text property as a key.

So, if I pass Text1 to a method - data property in the first object only should be sliced and the output should be:

 const mockData = [
    {
      text: 'Text1',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }]
    },
    {
      text: 'Text2',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }, { field: '4' }]
    }
  ];

If I pass 'Text2':

 const mockData = [
    {
      text: 'Text1',
       data: [
        { field: '1' },
        { field: '2' },
        { field: '3' },
        { field: '4' },
        { field: '5' },
        { field: '6' }
      ]
    },
    {
      text: 'Text2',
      data: [{ field: '1' }, { field: '2' }, { field: '3' }]
    }
  ];

What can be the solution? Thank you!

There's an output in the question. So, if I pass Text1 only in object with a 'text' = Text1, data array should be sliced. Other objects should remain. — lecham
– lecham, Commented Apr 1, 2020 at 16:33

CD.. · Accepted Answer · 2020-04-01 16:32:09Z

3

You can try to add a condition like this:

const sliceArray = (mockData, text) => 
                     mockData.map(d => d.text === text 
                        ? {...d, data: d.data.slice(0, 3)} 
                        : d)

answered Apr 1, 2020 at 16:32

CD..

74.3k25 gold badges160 silver badges170 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Nenad Vracar · Accepted Answer · 2020-04-01 16:32:57Z

You can just add another parameter to your function and check if the text matches that parameter.

 const mockData = [{"text":"Text1","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"},{"field":"5"},{"field":"6"}]},{"text":"Text2","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"}]}]

const sliceArray = (data, target, len = 3) => 
  data.map(({ text, data, ...rest}) => ({
    data: text == target ? data.slice(0, len) : data,
    text,
    ...rest
  }))

console.log(sliceArray(mockData, 'Text1'))

You could also pass an array of text values that you want to match and use includes method for checking.

 const mockData = [{"text":"Text1","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"},{"field":"5"},{"field":"6"}]},{"text":"Text2","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"}]}, {"text":"Text3","data":[{"field":"1"},{"field":"2"},{"field":"3"},{"field":"4"},{"field":"5"},{"field":"6"}]}]

const sliceArray = (data, targets, len = 3) => 
  data.map(({ text, data, ...rest}) => ({
    data: targets.includes(text) ? data.slice(0, len) : data,
    text,
    ...rest
  }))

console.log(sliceArray(mockData, ['Text1', 'Text3']))

xdeepakv · Accepted Answer · 2020-04-01 16:32:51Z

If you dont wanna to modify existing data, Since you are mocking. use reduce

const mockData = [
  {
    text: "Text1",
    data: [
      { field: "1" },
      { field: "2" },
      { field: "3" },
      { field: "4" },
      { field: "5" },
      { field: "6" }
    ]
  },
  {
    text: "Text2",
    data: [{ field: "1" }, { field: "2" }, { field: "3" }, { field: "4" }]
  }
];

function update(data, text, count = 3) {
  return data.reduce((arr, item) => {
    let updatedItem = { ...item };
    if (item.text === text) {
      updatedItem.data = (updatedItem.data || []).slice(0, count);
    }
    arr.push(updatedItem);
    return arr;
  }, []);
}

console.log("%j", update(mockData, "Text1"));

.as-console-row {color: blue!important}

Collectives™ on Stack Overflow

JS: slice a nested array in array of objects by index

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related