CODEWITHSUNDEEP
javascriptarraysjavascript-objects
margherita pizza
margherita pizza

Reputation: 7185

How can I filter nested objects and arrays with JavaScript?

My use case is something like this.

  1. I have an array that has an object.
  2. That each object has an array called menu
  3. Again that menu array has objected.
  4. That each object has an array dish_has_categories
  5. In dish_has_categories array, if there is an object with CategoryId is equal to 8 I want to filter out that root object.

My original data object

const data = [{
        menuName: "Hot dogs",
        menu: [
            {
            dishId: '1',
            dish_has_categories: [{
                CategoryId: '8'
            }]
        },
         {
            dishId: '2',
            dish_has_categories: [{
                CategoryId: '9'
            }]
        }]
    },
    {
        menuName: "Burgers",
        menu: [{
            dishId: '3',
            dish_has_categories: [{
                CategoryId: '6'
            }]
        }, {
            dishId: '4',
            dish_has_categories: [{
                CategoryId: '4'
            }]
        }]
    },
    {
        name: "Drinks",
        menu: []
    }
]

My expect result is

[{
        menuName: "Hot dogs",
        menu: [
            {
            dishId: '1',
            dish_has_categories: [{
                CategoryId: '8'
            }]
        },
         {
            dishId: '2',
            dish_has_categories: [{
                CategoryId: '9'
            }]
        }]
    }]

what I've done up to now is

const data2 = data.filter(element => {
    return element.menu.length > 0
})

I have no idea how to deep filter inside nested objects and arrays. Hope my question is clear to you all.

Upvotes: 9

Views: 29531

Answers (3)

Munsheer EK
Munsheer EK

Reputation: 96

You can use javascript filter() and some() . some() method checks if any of the elements in an array pass the function.

let data2 = data.filter(element => {
    let menu = element.menu.some(({dish_has_categories}) => dish_has_categories.some(({CategoryId}) => CategoryId === '8'));
    return menu;
           });
    console.log(data2);

Upvotes: 0

Code Maniac
Code Maniac

Reputation: 37775

You can use filter and some

Here nested some is used to check whether any of dish_has_categories has CategoryId equal to '8', if it is true then we include that menu in final output else we don't

const data =[{ menuName: "Hot dogs", menu: [ { dishId: '1', dish_has_categories: [{ CategoryId: '8' }] }, { dishId: '2', dish_has_categories: [{ CategoryId: '9' }] }] }, { menuName: "Burgers", menu: [{ dishId: '3', dish_has_categories: [{ CategoryId: '6' }] }, { dishId: '4', dish_has_categories: [{ CategoryId: '4' }] }] }, { name: "Drinks", menu: [] } ]

let op = data.filter(val => {
  let menu = val.menu.some(({dish_has_categories}) => dish_has_categories.some(({CategoryId}) => CategoryId === '8'))
  return menu
})

console.log('filtered values -->\n',op)

let names = op.map(({menuName})=> menuName)

console.log('Names --> \n', names)

Upvotes: 5

Maheer Ali
Maheer Ali

Reputation: 36594

You can use filter() with nested some().

The some() method tests whether at least one element in the array passes the test implemented by the provided function. It returns a Boolean value

const data = [{ menuName: "Hot dogs", menu: [ { dishId: '1', dish_has_categories: [{ CategoryId: '8' }] }, { dishId: '2', dish_has_categories: [{ CategoryId: '9' }] }] }, { menuName: "Burgers", menu: [{ dishId: '3', dish_has_categories: [{ CategoryId: '6' }] }, { dishId: '4', dish_has_categories: [{ CategoryId: '4' }] }] }, { name: "Drinks", menu: [] } ]

const res = data.filter(x => 
                x.menu.some(y => 
                    y.dish_has_categories.some(z => z.CategoryId === '8')
                )
            );
console.log(res)

Upvotes: 18

Related Questions