Why doesn't my filter function work? (Javascript).

Question

What I am trying to accomplish, being able to use the filter function to filter out the people that have the age: 21 and the color: blue.

Any suggestions on how to make it work? Thanks in advance.

Here is my code:

var arr = [   { name: 'Steve', age: 18, color: 'red' },   { name: 'Louis', age: 21, color: 'blue' },   { name: 'Mike', age: 20, color: 'green' },   { name: 'Greg', age: 21, color: 'blue' },   { name: 'Josh', age: 18, color: 'red' } ];

var filter = function(arr, criteria){
    var filtered = []
    for(var i=0; i<arr.length; i++){
        if (arr[i] === criteria) {
            filtered.push(arr[i])
        }
        return filtered; 
    }
     }

console.log(filter(arr, { age: 21, color: 'blue' }));

Because === compares object identity, instead of telling you wether the lhs has all the properties that the rhs has. — Bergi
– Bergi, Commented Dec 16, 2015 at 2:56

Community · Accepted Answer · 2017-05-23 11:53:07Z

3

Cant compare object with ===

Testing objects equality in NodeJS

You should add return outside for-loop

edited May 23, 2017 at 11:53

CommunityBot

11 silver badge

answered Dec 16, 2015 at 2:53

trquoccuong

2,8732 gold badges22 silver badges29 bronze badges

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

Comments

Johan Karlsson · Accepted Answer · 2015-12-16 03:24:19Z

3

var filter = function(arr, criteria){
    return arr.filter( function(item){
        return Object.keys(criteria).every(function(key) {
            return item[key] == criteria[key];
        });
    });
}

edited Dec 16, 2015 at 3:24

answered Dec 16, 2015 at 3:09

Johan Karlsson

6,4761 gold badge22 silver badges28 bronze badges

1 Comment

Bergi Over a year ago

You should just use every instead of forEach

Jessica O'Brien · Accepted Answer · 2015-12-16 02:54:59Z

2

The reason your solution is not working is because you cannot compare two objects using the equality operator, so you have to actually compare the properties of the objects, use a library like lodash or underscore with a built in comparison functino, or write a deep equals function yourself that iterates through the properties of each and returns false if at any point they are not equal.

Here is one possible solution:

var filter = function(arr, criteria){
  var filtered = []
  arr.forEach(function (item) {
    if (item.age === criteria.age && item.color === criteria.color) {
      filtered.push(item);
    }
  });
  return filtered;
};

answered Dec 16, 2015 at 2:54

Jessica O'Brien

1551 silver badge11 bronze badges

1 Comment

Bergi Over a year ago

Why not just use .filter() instead of .forEach()?

StackSlave · Accepted Answer · 2015-12-16 04:38:13Z

You'll have to loop over those Objects in your Array and test for their properties and property values. Here's a backward compatible way to do it:

function hasCompObjPropsAndVals(obj, compObj){
  var l = 0, c = 0;
  for(var i in compObj){
    l++;
    for(var p in obj){
      if(i === p && compObj[i] === obj[p]){
        c++;
        break;
      }
    }
  }
  if(l !== 0 && l === c){
    return true;
  }
  return false;
}
function filter(objArray, compObj){
  var res = [];
  for(var i=0,l=objArray.length; i<l; i++){
    var o = objArray[i];
    if(hasCompObjPropsAndVals(o, compObj)){
      res.push(o);
    }
  }
  return res;
}
var arr = [   { name: 'Steve', age: 18, color: 'red' },   { name: 'Louis', age: 21, color: 'blue' },   { name: 'Mike', age: 21, color: 'green' },   { name: 'Greg', age: 21, color: 'blue' },   { name: 'Josh', age: 18, color: 'red' } ];
console.log(filter(arr, {age: 21, color: 'blue'}));

Collectives™ on Stack Overflow

Why doesn't my filter function work? (Javascript).

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related