Skip to main content

filter()

filter<T>(collection, predicate): T[]

filter<T>(collection, predicate): Partial<T>

Iterates over elements of collection, returning an array of all elements predicate returns truthy for.

DEPRECATED

Use array.filter() or Object.entries().filter() directly instead.


Type Parametersโ€‹

T: Tโ€‹

The type of elements in the array, or the object type.


Parametersโ€‹

Overload 1:

collection: T[]โ€‹

The collection to iterate over.

predicate: (value, index, array) => booleanโ€‹

The function invoked per iteration.

Overload 2:

collection: Tโ€‹

The collection to iterate over.

predicate: (value, key, object) => booleanโ€‹

The function invoked per iteration.


Returns: T[]โ€‹

The new filtered array or object.


See Alsoโ€‹


Sinceโ€‹

2.0.0


Also known asโ€‹

filter (Lodash, es-toolkit, Remeda, Ramda, Effect) ยท โŒ (Radashi, Modern Dash, Antfu)


Exampleโ€‹

const numbers = [1, 2, 3, 4, 5];

// โŒ Deprecated approach
const evenNumbers = filter(numbers, n => n % 2 === 0);
console.log(evenNumbers); // [2, 4]

// โœ… Recommended approach (for arrays)
const evenNumbersNative = numbers.filter(n => n % 2 === 0);
console.log(evenNumbersNative); // [2, 4]

// โœ… Recommended approach (for objects)
const obj = { a: 1, b: 2, c: 3 };
const evenEntries = Object.fromEntries(
Object.entries(obj).filter(([, value]) => value % 2 === 0)
);
console.log(evenEntries); // { b: 2 }

How it works?โ€‹

Creates an array with elements that pass the predicate. Deprecated: Use array.filter() directly.

Native Equivalentโ€‹

// โŒ filter(arr, fn)
// โœ… arr.filter(fn)

Use Casesโ€‹

Extract matching items ๐Ÿ“Œโ€‹

Filter elements that match specific criteria.

const products = [{ category: "electronics" }, { category: "clothing" }];
products.filter(p => p.category === "electronics");

Filter active flags from objectโ€‹

Extract enabled flags from a configuration object.

const flags = { darkMode: true, beta: false, analytics: true };
Object.fromEntries(
Object.entries(flags).filter(([, enabled]) => enabled)
);
// => { darkMode: true, analytics: true }

Select high-priority itemsโ€‹

Filter items by priority level.

const notifications = [{ priority: "high" }, { priority: "low" }];
notifications.filter(n => n.priority === "high");

Filter events by date range for analyticsโ€‹

Select events within a specific time window for reporting. Essential for analytics dashboards, audit logs, and time-series data.

const startDate = new Date("2025-01-01");
const endDate = new Date("2025-01-31");

const events = [
{ type: "purchase", date: new Date("2025-01-15"), amount: 99 },
{ type: "purchase", date: new Date("2025-02-10"), amount: 49 },
{ type: "refund", date: new Date("2025-01-20"), amount: 30 },
];

const januaryEvents = filter(events, (e) => e.date >= startDate && e.date <= endDate);
// => [{ type: "purchase", date: Jan 15, ... }, { type: "refund", date: Jan 20, ... }]

Filter search results with multiple criteriaโ€‹

Apply combined filters on a product catalog or search results. Critical for e-commerce search, job boards, and any faceted filtering UI.

const products = [
{ name: "Laptop", price: 1200, category: "electronics", inStock: true },
{ name: "T-Shirt", price: 25, category: "clothing", inStock: true },
{ name: "Monitor", price: 400, category: "electronics", inStock: false },
{ name: "Keyboard", price: 80, category: "electronics", inStock: true },
];

const activeFilters = { category: "electronics", maxPrice: 500, inStock: true };

const results = filter(products, (p) =>
p.category === activeFilters.category &&
p.price <= activeFilters.maxPrice &&
p.inStock === activeFilters.inStock
);
// => [{ name: "Keyboard", price: 80, ... }]