Javascript - Filter object containing arrays with value from another array

Question

I have a problem implementing filtering for nested data. I have this kind of data from API :

  const animals = {
    bugs: ['ant', 'cricket'],
    fish: ['shark', 'whale', 'tuna'],
    mammals: ['cow', 'horse', 'sheep'],
    birds: ['eagle', 'crow', 'parrot'],
    predators: ['tiger', 'lion']
  }

I have to filter them with this array : const data = ['shark', 'horse', 'cow', 'parrot']

The result I want to achieve :

const filtered = {
    fish: ['shark'],
    mammals: ['cow', 'horse'],
    birds: ['parrot'],
}

I have tried :

filter.forEach((item) => {
      for (let key in animals) {
        let species = []
        if (animals[key].includes(item)) {
          filtered[key] = [...species, species]
        }
      }
    })

and the result :

const filtered = {
      fish: ['whale'],
      mammals: ['cow',],
      birds: ['parrot'],
    }

I still can't achieve the desired outcome, because the items inside array will not be added but replaced. I'm stuck here. Any help will be really appreciated. Thanks !

Hi, What's your attempt and where are you stuck?

malarres
– malarres

2022-06-20 07:21:43 +00:00
Commented Jun 20, 2022 at 7:21 — malarres
– malarres, Commented Jun 20, 2022 at 7:21

Nina Scholz · Accepted Answer · 2022-06-20 07:50:01Z

3

You could rebuild the entries of the object.

const
    animals = { bugs: ['ant', 'cricket'], fish: ['shark', 'whale', 'tuna'], mammals: ['cow', 'horse', 'sheep'], birds: ['eagle', 'crow', 'parrot'], predators: ['tiger', 'lion'] },
    data = ['shark', 'horse', 'cow', 'parrot'],
    result = Object.fromEntries(Object
        .entries(animals)
        .flatMap(([k, a]) => {
            a = a.filter(v => data.includes(v));
            return a.length
                ? [[k, a]]
                : []
        })
    );

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

answered Jun 20, 2022 at 7:50

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

Comments

pilchard · Accepted Answer · 2022-06-20 07:30:54Z

3

First you need to loop your object then filter arrays of animals according to data.

const animals = {  fish: ['shark', 'whale', 'tuna'],  mammals: ['cow', 'horse', 'sheep'],  birds: ['eagle', 'crow', 'parrot'],};
const data = ['shark', 'horse', 'cow', 'parrot'];

let filtered = {};
for (var a of Object.keys(animals)) {
  filtered[a] = animals[a].filter(value => data.includes(value));
}
console.log(filtered);

edited Jun 20, 2022 at 7:30

pilchard

13.1k5 gold badges14 silver badges27 bronze badges

answered Jun 20, 2022 at 7:29

Hakan SONMEZ

2,2342 gold badges23 silver badges35 bronze badges

1 Comment

Skygazer Over a year ago

wow. Thanks for the answer. It worked for my current question. My bad, I forgot to mention one thing. I updated it. The animals array contains more fields than the data. For example it has 8 fields where the data has only 3. Your answer is great but it will leave some object with empty arrays. How to return only fields that is not containing empty array ?

User456 · Accepted Answer · 2022-06-20 07:26:00Z

1

You can use the filter method:

const fish = animals.fish.filter((animal) => animal === 'shark');
const mammals = animals.mammals.filter((animal) => animal === 'cow' || animal === 'horse');
const birds = animals.birds.filter((animal) => animal === 'parrot');

const filtered = {
  fish, // equals to fish: fish
  mammals, // equals to mammals: mammals
  birds, // equals to birds: birds
};

Note that this is just an example. You can put your own checks in the callback functions but it should return a boolean.

answered Jun 20, 2022 at 7:26

User456

1,3117 silver badges16 bronze badges

Comments

malarres · Accepted Answer · 2022-07-12 12:27:45Z

1

You can iterate over the object and create a new one with the filtered data

  const animals = {
    bugs: ['ant', 'cricket'],
    fish: ['shark', 'whale', 'tuna'],
    mammals: ['cow', 'horse', 'sheep'],
    birds: ['eagle', 'crow', 'parrot'],
    predators: ['tiger', 'lion']
  }

const data = ['shark', 'horse', 'cow', 'parrot']
const filtered = {};

for ( arr in animals) {
  filtered[arr] = animals[arr].filter ( x => data.includes(x))
}

console.log(filtered)

EDIT if you don't want empty arrays as part of the solution:

const animals = {
    bugs: ['ant', 'cricket'],
    fish: ['shark', 'whale', 'tuna'],
    mammals: ['cow', 'horse', 'sheep'],
    birds: ['eagle', 'crow', 'parrot'],
    predators: ['tiger', 'lion']
  }

const data = ['shark', 'horse', 'cow', 'parrot']
const filtered = {};
let tmp = [];
for ( arr in animals) {
  tmp  = animals[arr].filter ( x => data.includes(x))
  if (tmp.length > 0) filtered[arr] = tmp
}

console.log(filtered)

edited Jul 12, 2022 at 12:27

answered Jun 20, 2022 at 8:01

malarres

2,9481 gold badge24 silver badges37 bronze badges

2 Comments

Skygazer Over a year ago

Hi, your answer is great and concise. Thanks!. But how to make the result just contains fields with non empty array values?

malarres Over a year ago

@FadhilRadh I've edited the answer with a tmp val to let out the empty arrays

Collectives™ on Stack Overflow

Javascript - Filter object containing arrays with value from another array

4 Answers 4

Comments

1 Comment

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related