Adding a Conditional to a Filter function in Javascript

Question

I have an object array called filteredAnimals that returns the animals which are present in a given filter.

 if (!dog.present) {
    filteredAnimals = filteredAnimals.filter(
      e => !e.animal_type.includes('Dog'),
    );
  }

 if (!cat.present) {
    filteredAnimals = filteredAnimals.filter(
      e => !e.animal_type.includes('Cat'),
    );
  }

 if (!fish.present) {
    filteredAnimals = filteredAnimals.filter(
      e => !e.animal_type.includes('fish'),
    );
  }

Is there a way to combine this in one call? I'm a bit stumped because the call won't be made unless the conditional is met. I was thinking of making a function but I feel there's a better way to do this.

Are "Dog", "Cat" and "fish" the only conditions that will be filtered? Why is there a comma , following .includes()? — guest271314
– guest271314, Commented Feb 13, 2019 at 1:31
oh for some reason my code worked but that shouldn't be in there thanks — lost9123193
– lost9123193, Commented Feb 13, 2019 at 1:33
@guest271314 Trailing commas in parameter lists are permitted (style is just rare) — CertainPerformance
– CertainPerformance, Commented Feb 13, 2019 at 1:46

CertainPerformance · Accepted Answer · 2019-02-13 01:49:41Z

3

You can use three conditions:

const finalFilteredAnimals = filteredAnimals.filter(({ animal_type }) => (
  (dog.present || !animal_type.includes('Dog')) &&
  (cat.present || !animal_type.includes('Cat')) &&
  (fish.present || !animal_type.includes('fish'))
));

Note that it would be better if dog, cat, and fish were in a larger object, say animals, so that you could iterate over an array of ['Dog', 'Cat', 'fish'] instead:

const finalFilteredAnimals = filteredAnimals.filter(({ animal_type }) => (
  ['Dog', 'Cat', 'fish'].every(animName => (
    animal[animName].present || !animal_type.includes(animName)
  ))
));

edited Feb 13, 2019 at 1:49

answered Feb 13, 2019 at 1:28

CertainPerformance

374k55 gold badges354 silver badges359 bronze badges

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

2 Comments

lost9123193 Over a year ago

so I have a question, the code above doesn't work. When the dog.present is not present it should show cat and fish. But the filter above sets it so that if dog is not present the result outputs only dogs. I think it has something to do with the &&

lost9123193 Over a year ago

Oh that makes a lot of sense. Thank you!

Collectives™ on Stack Overflow

Adding a Conditional to a Filter function in Javascript

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related