How to filtering out the multiple nested object in Javascript object

Question

Javascript

I have a nested array of objects, I'm trying to filter the given array of objects using a property from the third level of its array property value. For example, from the below array I like to filter the entire array using the property ListId: 10

Example

let test = {
   "test":true,
   "group":[
      {
         "name":"header",
         "value":[
            {
               "id":"0",
               "list":[
                  {
                     "ListId":10,
                     "name":"string1",
                     "state":"BY",
                     "techId":0
                  },
                  {
                     "ListId":11,
                     "name":"string2",
                     "state":"BY"
                  },
                  {
                     "ListId":12,
                     "name":"string3",
                     "state":"BY"
                  }
               ]
            }
         ]
      },
      {
         "name":"header2",
         "value":[
            {
               "id":"01",
               "list":[
                  {
                     "ListId":100,
                     "name":"string1",
                     "state":"BY",
                     "techId":0
                  },
                  {
                     "ListId":111,
                     "name":"string2",
                     "state":"BY"
                  },
                  {
                     "ListId":121,
                     "name":"string3",
                     "state":"BY"
                  }
               ]
            }
         ]
      }
   ]
}

Filtervalue with ListId = 10

Expected output :

{
   "test":true,
   "group":[
      {
         "name":"header",
         "value":[
            {
               "id":"0",
               "list":[
                  {
                     "ListId":10,
                     "name":"string1",
                     "state":"BY",
                     "techId":0
                  }
               ]
            }
         ]
      }
   ]
}

How can I use the filter method using javascript to get this expected result?

Answer 1

You can two it in two times :

• First, filter the list arrays,
• Secondly filter the groups array using the some method

let test= {
  "test": true,
  "group": [
    {
      "name": "header",
      "value": [
        {
          "id": "0",
          "list": [
            {
              "ListId": 10,
              "name": "string1",
              "state": "BY",
              "techId": 0
            },
            {
              "ListId": 11,
              "name": "string2",
              "state": "BY"
            },
             {
              "ListId": 12,
              "name": "string3",
              "state": "BY"
            }
          ]
        }
      ]
    },
    {
      "name": "header2",
      "value": [
        {
          "id": "01",
          "list": [
            {
              "ListId": 100,
              "name": "string1",
              "state": "BY",
              "techId": 0
            },
            {
              "ListId": 111,
              "name": "string2",
              "state": "BY"
            },
             {
              "ListId": 121,
              "name": "string3",
              "state": "BY"
            }
          ]
        }
      ]
    }
  ]
}

test.group.forEach(group => {
  group.value.forEach(value => {
    value.list = value.list.filter(list => list.ListId === 10)
  })
})

test.group = test.group.filter(group => group.value.some(value => value.list.length > 0))

console.log(test)

Note : You should use plural names for you arrays, it helps understanding the data. For example lists not list for the array.

Answer 2

let z ={"group1": [
  {
    "name": "header",
    "value": [
      {
        "id": 0,
        "list": [
          {
            "ListId": 10,
            "Name": "string1"
          },
          {
            "ListId": 11,
            "Name": "string2"
          }
        ]
      }
    ]
  }
]}


// This function was written from understading that 'group1' is not a fixed property, but part of a dynamic list due to the number '1'
const getItemByListId = (list, listId) => {
  const listKeys = Object.keys(list);
  const selectedListKey = listKeys.find(key => {
    const groupItems = list[key];
    const selectedItem = groupItems.find(({ value: nestedItems }) => {
      const selectedNestedItem = nestedItems.find(({ list }) => {
        const selectedList = list.find(({ ListId }) => ListId === listId)
        return selectedList;
      });
      return selectedNestedItem;
    });

    return selectedItem;
  });
  
  if (!selectedListKey) {
    return null;
  }

  return list[selectedListKey];
};


console.log(getItemByListId(z, 10));