How to Filter Multiple Conditions in JavaScript

Use JavaScript’s filter() method with a predicate that returns true only when an item meets every required condition. For criteria supplied at runtime, compare each requested property-value pair; for known criteria, join comparisons with &&. In both cases, filter() returns a new array containing the matching items.

Filter Multiple Conditions in JavaScript

The filter() method calls its callback for each assigned array element and keeps an element when the callback result is truthy. It does not change the element to true or false, and it leaves the original array unchanged. The callback receives the current element, its index, and the array; most predicates need only the element. The returned array is new, but its matching objects are the same object references as in the source array.

filter(callbackFn)

Here, callbackFn is a predicate: it evaluates an element and returns a truthy or falsy result. If no elements match, the returned array has no elements. Sparse array slots are skipped because the callback is not called for indexes without assigned values. See the MDN documentation for filter() for the full callback signature and behavior.

Use Traditional Method

When the set of conditions comes from a form or another data source, store it in an object and test its entries. This example requires each requested key to be an own property of the user and its value to match exactly. The supplied criteria select Aleena because both her name and address match.

const criteria = {
  address: 'India',
  name: 'Aleena'
};
const users = [
  {name: 'John Doe', email: 'johndoe@mail.com', age: 25, address: 'USA'},
  {name: 'Aleena', email: 'aleena@mail.com', age: 35, address: 'India'},
  {name: 'Mark Smith', email: 'marksmith@mail.com', age: 28, address: 'England'}
];

const filteredUsers = users.filter((user) => {
  return Object.entries(criteria).every(([key, value]) =>
    Object.prototype.hasOwnProperty.call(user, key) && user[key] === value
  );
});

console.log(filteredUsers);

[
  {
    name: 'Aleena',
    email: 'aleena@mail.com',
    age: 35,
    address: 'India'
  }
]

Object.entries(criteria) supplies the property-value pairs, and every() requires all of them to pass. Strict equality (===) means the value and type must match; a missing property does not match a supplied value. With an empty criteria object, every() returns true for each user, so the result contains all users. This pattern adapts to any set of keys without adding a separate comparison for each field.

The own-property check also prevents an inherited property from satisfying a requested key. For nested data, compare the nested value explicitly or supply a predicate for that field; this example compares the top-level values directly.

Use the Filter Method

If the conditions are fixed and known in advance, write them directly in the predicate and combine them with the logical AND operator (&&). Each comparison must be true for the user to be retained. This complete example uses the same data and produces the same matching user as the dynamic version.

const filter = {
  address: 'India',
  name: 'Aleena'
};
const users = [
  {name: 'John Doe', email: 'johndoe@mail.com', age: 25, address: 'USA'},
  {name: 'Aleena', email: 'aleena@mail.com', age: 35, address: 'India'},
  {name: 'Mark Smith', email: 'marksmith@mail.com', age: 28, address: 'England'}
];

const filteredUsers = users.filter(
  (user) => user.name === filter.name && user.address === filter.address
);

console.log(filteredUsers);

[
  {
    name: 'Aleena',
    email: 'aleena@mail.com',
    age: 35,
    address: 'India'
  }
]

Use this direct form when the fields and comparisons are part of the program’s logic. Use the dynamic form when the set of requested fields can change. The original JSFiddle demo is also available.

Keep the predicate focused on inclusion rules: return a truthy value for items to keep, and a falsy value for items to omit. Because && short-circuits, later comparisons run only after earlier comparisons pass. Reorder checks when an earlier comparison can cheaply rule out many items, while keeping the condition’s meaning clear.