Javascript - Filter array of objects using the objects array property

FriedBrain
November 30, 2023
132 views
3 votes
3 Answers

Im trying to get my head round this not sure if its even possible this way but just cant seem to get the hang of it.

I have and array of object and each oject has a few values and another array of ojects. Basically i need to filter the main array and remove a singleobject from the events array.

Here is the data array

let data = [
  {
    id: 1,
    date: '2023-10-01',
    events: [{ id: '1a', name: 'event 1' }, { id: '1b', name: 'event 2' }],
  },
  {
    id: 2,
    date: '2023-10-02',
    events: [{ id: '2a', name: 'event 1' }, { id: '2b', name: 'event 2' }],
  },
  {
    id: 3,
    date: '2023-10-03',
    events: [{ id: '3a', name: 'event 1' },{ id: '3b', name: 'event 2' }],
  },
];

Example of what i want to do is filter the data if the id == 1 then if event.name == `event 1` ->

let data = [
  {
    id: 1,
    date: '2023-10-01',
    events: [{ id: '1a', name: 'event 1'}],
  },
  {
    id: 2,
    date: '2023-10-02',
    events: [{ id: '2a', name: 'event 1' }, { id: '2b', name: 'event 2' }],
  },
  {
    id: 3,
    date: '2023-10-03',
    events: [{ id: '3a', name: 'event 1' },{ id: '3b', name: 'event 2' }],
  },
];

Here is what i have tried to do but i just cant get the hang of it

console.log(data.filter((item) => item.id !== '1')[0].events.filter((event) => event.id != '1b'))

I Have also tried to filter then filter that but cant i seem to get it either

const filterd = (data.filter((item) => item.id == '1'))
console.log(filterd.filter((event) => event.id == '1a'))

Any help or suggestions welcome Thanks

Tags: arrays javascript

Answers

You’re not looking to filter data itself. You’re looking to loop over data and, if a given condition is met on an object in that loop, filter a property on that object.

For example:

let data = [
  {
    id: 1,
    date: '2023-10-01',
    events: [{ id: '1a', name: 'event 1' }, { id: '1b', name: 'event 2' }],
  },
  {
    id: 2,
    date: '2023-10-02',
    events: [{ id: '2a', name: 'event 1' }, { id: '2b', name: 'event 2' }],
  },
  {
    id: 3,
    date: '2023-10-03',
    events: [{ id: '3a', name: 'event 1' },{ id: '3b', name: 'event 2' }],
  },
];

data.forEach(d => {                                        // loop over data
  if (d.id === 1) {                                        // if condition is met
    d.events = d.events.filter(e => e.name === 'event 1'); // filter events
  }
});

console.log(data);

If you want to create a new array, not mutating any existing array, then:

const data = [{id: 1,date: '2023-10-01',events: [{ id: '1a', name: 'event 1' }, { id: '1b', name: 'event 2' }],},{id: 2,date: '2023-10-02',events: [{ id: '2a', name: 'event 1' }, { id: '2b', name: 'event 2' }],},{id: 3,date: '2023-10-03',events: [{ id: '3a', name: 'event 1' },{ id: '3b', name: 'event 2' }],},];

const result = data.map(obj =>
    obj.id !== 1 ? obj : {
        ...obj, 
        events: obj.events.filter(({name}) => 
            name === 'event 1'
        )
    }
);

console.log(result);

Let’s say that your second array looks something like this:

const ev_data = [{id:1,event_name:'event 1'},{id:2,event_name:'event 2'}];

Where id is the id to find in the first array, and event_name is the value to filter the events property in the first array by;

Then you could use a for-in loop as follows:

const data = [
  {
    id: 1,
    date: '2023-10-01',
    events: [{ id: '1a', name: 'event 1' }, { id: '1b', name: 'event 2' }],
  },
  {
    id: 2,
    date: '2023-10-02',
    events: [{ id: '2a', name: 'event 1' }, { id: '2b', name: 'event 2' }],
  },
  {
    id: 3,
    date: '2023-10-03',
    events: [{ id: '3a', name: 'event 1' },{ id: '3b', name: 'event 2' }],
  },
];

const ev_data = [{id:1,event_name:'event 1'},{id:2,event_name:'event 2'}];

//this modifies the original array, data
for(const i in data) {
    const cur = data[i];
    const ev = ev_data.find(({id}) => id === cur.id);
    if( ev ) {
        cur.events = cur.events.filter(({name}) => name === ev.event_name);
    }
}

console.log( data );

Please signup or login to give your own answer.

Click here to cancel reply.

Javascript – Filter array of objects using the objects array property

Answers