How to filter array of array objects?

Question

Trying to filter array of array objects. when variable matches with array of object value of dropDownOne key 'filterValue', then it will return dropDownTwo array,

 let testName = ‘ filterValue’

 var nestedArray =  [
      [
          {
              dropDownOne: {
                  key: "filterValue",
                  value: "test1"
              },
              dropDownTwo: [
                  {
                      key: "retrieveArrKey1",
                      value: "test123"
                  },
                  {
                      key: "retrieveArrKey2",
                      value: "test345"
                  }
              ]
          }
      ],

[
          {
              dropDownOne: {
                  key: "NoFilter",
                  value: "test2"
              },
              dropDownTwo: [
                  {
                      key: "dropDown2",
                      value: "test"
                  },
                  {
                      key: "dropDown3",
                      value: "test"
                  }
              ]
          }
      ]
    ]




  Output = 
    
     dropDownTwo:[
                      {
                          key: "retrieveArrKey1",
                          value: "test123"
                      },
                      {
                          key: "retrieveArrKey2",
                          value: "test345"
                      }
                  ]

Tried with this

 let filterObj = nestedArray.filter((arr => arr.filter(value => {
        if (value[0].dropDownOne.key === 'filterValue') {
          return arr[1];
        }
      }))

But did not get the correct result

do you really have the outer objects wrapped insiide of an array with only one object? — Nina Scholz
– Nina Scholz, Commented Dec 19, 2022 at 13:00

flyingfox · Accepted Answer · 2022-12-19 13:00:49Z

We can use Array.flat() and Array.flatMap() combined with Array.filter() to do it

let result = nestedArray.flat().filter(e => e.dropDownOne.key === testName).flatMap(e => e.dropDownTwo)
console.log(result)

let testName = `filterValue`

 var nestedArray =  [
      [
          {
              dropDownOne: {
                  key: "filterValue",
                  value: "test1"
              },
              dropDownTwo: [
                  {
                      key: "retrieveArrKey1",
                      value: "test123"
                  },
                  {
                      key: "retrieveArrKey2",
                      value: "test345"
                  }
              ]
          }
      ],

[
          {
              dropDownOne: {
                  key: "NoFilter",
                  value: "test2"
              },
              dropDownTwo: [
                  {
                      key: "dropDown2",
                      value: "test"
                  },
                  {
                      key: "dropDown3",
                      value: "test"
                  }
              ]
          }
      ]
    ]
    
let result = nestedArray.flat().filter(e => e.dropDownOne.key === testName).flatMap(e => e.dropDownTwo)
console.log(result)

Ali Sattarzadeh · Accepted Answer · 2022-12-19 13:03:11Z

You can do it in this way :

nestedArray.filter(arr => arr.find(item=> item.dropDownOne.key === 'filterValue'))[0][0].dropDownTwo

var nestedArray =  [
      [
          {
              dropDownOne: {
                  key: "filterValue",
                  value: "test1"
              },
              dropDownTwo: [
                  {
                      key: "retrieveArrKey1",
                      value: "test123"
                  },
                  {
                      key: "retrieveArrKey2",
                      value: "test345"
                  }
              ]
          }
      ],

[
          {
              dropDownOne: {
                  key: "NoFilter",
                  value: "test2"
              },
              dropDownTwo: [
                  {
                      key: "dropDown2",
                      value: "test"
                  },
                  {
                      key: "dropDown3",
                      value: "test"
                  }
              ]
          }
      ]
    ]




const result = nestedArray.filter(arr => arr.find(item=> item.dropDownOne.key === 'filterValue'))[0][0].dropDownTwo


console.log(result)

Mohammed Swillam · Accepted Answer · 2022-12-19 13:29:13Z

1

You could use both flat() to flatten the nestedArray, then use the find() method to find the object with a dropDownOne.key that matches the value of testName.

it should then return the dropDownTwo property of that object.

let result = nestedArray.flat().find(obj => obj.dropDownOne.key === testName);
let filterObj = result ? result.dropDownTwo : [];
    
console.log(filterObj);

a full running example:

let testName = 'filterValue';

var nestedArray = [
  [{
    dropDownOne: {
      key: "filterValue",
      value: "test1"
    },
    dropDownTwo: [{
        key: "retrieveArrKey1",
        value: "test123"
      },
      {
        key: "retrieveArrKey2",
        value: "test345"
      }
    ]
  }],

  [{
    dropDownOne: {
      key: "NoFilter",
      value: "test2"
    },
    dropDownTwo: [{
        key: "dropDown2",
        value: "test"
      },
      {
        key: "dropDown3",
        value: "test"
      }
    ]
  }]
]

let result = nestedArray.flat().find(obj => obj.dropDownOne.key === testName);
let filterObj = result ? result.dropDownTwo : [];
    
console.log(filterObj);

edited Dec 19, 2022 at 13:29

answered Dec 19, 2022 at 13:06

Mohammed Swillam

9,2524 gold badges38 silver badges47 bronze badges

2 Comments

Vladislav Kibenko Over a year ago

Will throw an error in case, find returned undefined

Mohammed Swillam Over a year ago

oops moment solved! thanks :)

Vladislav Kibenko · Accepted Answer · 2022-12-19 13:32:23Z

Don't like other solutions due to too many array iterations. You could make a single run using reduce function which is a grandfather of many JS Array functions. It looks a bit worse than flat-filter-flat-..., but will probably work way faster due to much lower array iterations.

const testName = 'filterValue';
const nestedArray = [
  [{
    dropDownOne: {key: 'filterValue', value: 'test1'},
    dropDownTwo: [
      {key: 'retrieveArrKey1', value: 'test123'},
      {key: 'retrieveArrKey2', value: 'test345'},
    ],
  }],
  [{
    dropDownOne: {key: 'NoFilter', value: 'test2'},
    dropDownTwo: [
      {key: 'dropDown2', value: 'test'},
      {key: 'dropDown3', value: 'test'},
    ],
  }],
];

const result = nestedArray.reduce((acc, nestedItem) => {
  nestedItem.forEach(item => {
    if (item.dropDownOne.key === testName) {
      acc.push(item.dropDownTwo);
    }
  });
  return acc;
}, []);

console.log(result);

Collectives™ on Stack Overflow

How to filter array of array objects?

4 Answers 4

Comments

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related