How to Implement filter() for Objects in JavaScript?

To filter objects within an array in JavaScript, we can implement a custom filter() method. While JavaScript’s built-in filter() method works well for arrays, we may want to filter objects based on specific properties or combinations of properties.

1. Filtering an Object by Its Values

A common use case for filtering an object is to keep only those properties where the value meets a certain condition. For instance, we may have an object representing people and their ages, and we want to retain only the people who are older than 30.

const people = {
    Jiya: 25,
    Alia: 35,
    Bobby: 45,
    Sara: 28
};

const filtered = Object.fromEntries(
    Object.entries(people).filter(([name, age]) => age > 30)
);

console.log(filtered); 

{ Alia: 35, Bobby: 45 }

In this example

• Object.entries(people) converts the object into an array of key-value pairs: [["Jiya", 25], ["Alia", 35], ["Bobby", 45], ["Sara", 28]].
• .filter() applies a condition that checks if the value (age) is greater than 30.
• Object.fromEntries() converts the filtered array back into an object.

2. Filtering an Object by Its Keys

Filtering an object by its keys involves selecting or removing specific properties from an object based on the keys. This is useful when us want to exclude certain properties or focus only on a subset of keys.

const animal = {
    cat: { color: 'white', age: 5 },
    dog: { color: 'brown', age: 3 },
    bird: { color: 'blue', age: 2 }
};

const filtered = Object.fromEntries(
    Object.entries(animal).filter(([key, value]) => key !== 'dog')
);

console.log(filtered);

{ cat: { color: 'white', age: 5 }, bird: { color: 'blue', age: 2 } }

In this example

• Object.entries(animalData) converts the object to an array of key-value pairs.
• .filter() filters out the dog key.
• Object.fromEntries() creates a new object with the filtered data.

3. Filtering an Array of Objects

Filtering an array of objects is a common operation in JavaScript when working with collections of data. Often, we may need to filter an array of objects based on specific property values.

const people = [
    { name: 'Jiya', age: 25 },
    { name: 'Alia', age: 35 },
    { name: 'Bobby', age: 45 },
    { name: 'Sara', age: 28 }
];

const filtered = people.filter(person => person.age > 30);
console.log(filtered); 

[ { name: 'Alia', age: 35 }, { name: 'Bobby', age: 45 } ]

In this example

• .filter() is applied to the array of objects, and the condition person.age > 30 filters out those who are older than 30.

4. Filtering with Multiple Conditions

When filtering an array of objects, you might need to apply multiple conditions simultaneously. This allows us to filter objects based on more than one property or multiple criteria.

const products = [
    { name: 'Laptop', price: 800, category: 'electronics' },
    { name: 'Shoes', price: 50, category: 'fashion' },
    { name: 'Watch', price: 150, category: 'electronics' },
    { name: 'Shirt', price: 20, category: 'fashion' }
];

const filtered = products.filter(product => 
    product.price < 100 && product.category === 'fashion'
);

console.log(filtered);

[
  { name: 'Shoes', price: 50, category: 'fashion' },
  { name: 'Shirt', price: 20, category: 'fashion' }
]

In this example

• The .filter() method checks two conditions using the && (AND) operator.
• It keeps only products with a price less than 100 and belonging to the 'fashion' category.