Using Underscore.js to filter an array of objects on a property using a 'contains'

Question

I have an array of objects which I would like to filter using a contains/any method on a property using underscore.

For example, if I had the following variables:

var people = [
{
    name: 'Dave',
    age: 26
},
{
    name: 'Frank',
    age: 23
}];
var allowedAges = [20, 23, 24];

I would like to use underscore to end up with a result like:

 var allowedPeople = [];
 _.each(_.where(people, { age: _.any()}), function (person) {
            allowedPeople.push(person);
        });

And there may also be occasions where allowedAges is an array of objects and id want to use the contains/any on the people array using a property of the objects in allowedAges.

ssube · Accepted Answer · 2016-03-30 14:46:13Z

12

The JS equivalent of contains is usually indexOf (and find in rare cases).

You can use the built-in Array.prototype.filter to do this like:

people.filter(function (person) {
  return allowedAges.indexOf(person.age) !== -1; // -1 means not present
});

or with underscore, using the same predicate:

_.filter(people, function (person) {
  return allowedAges.indexOf(person.age) !== -1; // -1 means not present
}

If you have access to ES6 collections or a polyfill for Set, you can replace the allowedAges array with a set (enforcing unique values) and simply use Set.prototype.has:

people.filter(person => allowedAges.has(person.age))

answered Mar 30, 2016 at 14:46

ssube

48.4k10 gold badges107 silver badges144 bronze badges

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

3 Comments

Software Engineer Over a year ago

The OP asked for an underscore solution, not a plain js solution. I can't downvote this because you've answered the question as asked, and the pure js solution can be seen as extra info, but why is the pure js stuff necessary at all given that the OP exlicitly asked a question about underscore? And, why is the 'native' part of your answer first?

George Over a year ago

@EngineerDollery "I would like to use underscore" Doesn't mean he must use underscore, no where did they state "This must be done using underscore"

ssube Over a year ago

@EngineerDollery To promote the built in methods. A lot of people forget about them, but in most browsers now, underscore just defers to them ( underscore is largely a polyfill from before arrays had functional methods). Since the OP asked about underscore, the equivalent solution is there just in case.

Aldehir · Accepted Answer · 2016-03-30 15:10:48Z

3

For the sake of completeness, here's an underscore solution that works with a mixed array of integers and objects containing an age property.

var allowedPeople = _.filter(people, (p) =>
  _.some(allowedAges, (a) => (a.age || a) === p.age)
);

answered Mar 30, 2016 at 15:10

Aldehir

2,06313 silver badges10 bronze badges

1 Comment

Bitfool Over a year ago

Two different times I've searched and found this post, and both times the first two answers yielded empty arrays for me, but this one from Aldehir has worked both times.

Matthew Herbst · Accepted Answer · 2016-03-30 14:49:31Z

0

Why not use vanilla js filter?

var people = [
  {
    name: 'Dave',
    age: 26
  },
  {
    name: 'Frank',
    age: 23
  }
];

var allowedAges = [20, 23, 24];

var allowedPeople = people.filter(function((person, i, arr) {
  return allowedAges.indexOf(person.age) !== -1;
});

answered Mar 30, 2016 at 14:49

Matthew Herbst

32.3k27 gold badges92 silver badges141 bronze badges

2 Comments

Software Engineer Over a year ago

The OP asked for an underscore solution, not a plain js solution.

Matthew Herbst Over a year ago

@EngineerDollery it's very possible OP didn't know there was a non-underscore solution.

Rajesh Dixit · Accepted Answer · 2016-03-30 14:51:02Z

0

This is a pure JS version:

var people = [{
  name: 'Dave',
  age: 26
}, {
  name: 'Frank',
  age: 23
}];
var allowedAges = [20, 23, 24];

function filterData(arr, key, searchList){
  var result = [];
  if(Array.isArray(searchList)){
    result = arr.filter(function(item){
      return (searchList.indexOf(item[key])>-1);
    });
  }
  else{
    result = arr.filter(function(item){
      return (searchList === item[key]);
    });
  }
  return result;
}

document.write("<pre>" + JSON.stringify(filterData(people,"age", allowedAges), 0, 4) + "</pre>")

answered Mar 30, 2016 at 14:51

Rajesh Dixit

25k5 gold badges52 silver badges86 bronze badges

1 Comment

Software Engineer Over a year ago

The OP asked for an underscore solution, not a plain js solution.

Collectives™ on Stack Overflow

Using Underscore.js to filter an array of objects on a property using a 'contains'

4 Answers 4

3 Comments

1 Comment

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related