Skip to content
Brought to you by Allons-y Studio
dashly A standard library of filters, transforms, & shortcodes for Eleventy

arrays

In Filters

Array-manipulation filters for Eleventy. Nunjucks & Liquid have native first / last / reverse filters, but 11ty.js (JavaScript) templates & Handlebars do not. Registering these via dashly makes them available in all four, as checked by test/engines.test.js.

import {
	first,
	last,
	reverse,
	groupBy,
	sortBy,
	chunk,
	where,
	pluck,
} from '@allons-y/dashly/filters/arrays';

first(value, n?)

Return the first item of an array, or the first n items if a count is supplied. With no count, matches Nunjucks first (single item). With a count, returns the first N items — covers the "limit / head" use case.

Parameters

Name Type Default Description
value readonly T[]
n (optional) number

Returns

T | T[] | undefined

Examples

// 'a'
first(['a', 'b', 'c']);
// ['a', 'b']
first(['a', 'b', 'c'], 2);
{{ collections.posts | first }}
{% for post in collections.posts | first(3) %} … {% endfor %}

last(value, n?)

Return the last item of an array, or the last n items if a count is supplied. Mirror of first.

Parameters

Name Type Default Description
value readonly T[]
n (optional) number

Returns

T | T[] | undefined

Examples

// 'c'
last(['a', 'b', 'c']);
// ['b', 'c']
last(['a', 'b', 'c'], 2);
{{ collections.posts | last }}

reverse(value)

Reverse an array or a string without mutating the input.

Parameters

Name Type Default Description
value readonly T[] | string

Returns

T[] | string

Examples

// [3, 2, 1]
reverse([1, 2, 3]);
// 'cba'
reverse('abc');
{{ collections.posts | reverse }}

groupBy(value, keyOrFn)

Group array items by a key, a dot-path, or a function. Returns a plain object keyed by the grouping value, with each value an array of items.

Parameters

Name Type Default Description
value readonly T[]
keyOrFn string | ((item: T) => unknown) Property name (dot-paths supported, e.g. 'data.year') or selector function.

Returns

Record<string, T[]>

Examples

// { 2025: [...], 2026: [...] }
groupBy(posts, 'data.year');
groupBy(posts, (p) => p.data.tags[0]);
{% for year, items in collections.posts | groupBy('data.year') %} … {% endfor %}

sortBy(value, keyOrFn, order?)

Sort an array by a key, dot-path, or selector function, without mutating the input. String values are compared with localeCompare; everything else with standard < / >.

Parameters

Name Type Default Description
value readonly T[]
keyOrFn string | ((item: T) => unknown)
order (optional) 'asc' | 'desc' 'asc'

Returns

T[]

Examples

sortBy(posts, 'data.date', 'desc');
sortBy(items, (item) => item.priority);

chunk(value, size)

Split an array into N-sized chunks. The final chunk may be smaller than size. Returns an empty array for non-array or invalid-size input.

Parameters

Name Type Default Description
value readonly T[]
size number

Returns

T[][]

Examples

// [[1, 2], [3, 4], [5]]
chunk([1, 2, 3, 4, 5], 2);
{# render a gallery grid #}
{% for row in images | chunk(3) %} … {% endfor %}

where(value, keyOrFn, expected?)

Filter an array by a key/dot-path equality check. When expected is omitted, items where the keyed value is truthy are kept (useful for where(posts, 'data.featured')).

Parameters

Name Type Default Description
value readonly T[]
keyOrFn string | ((item: T) => unknown)
expected (optional) unknown

Returns

T[]

Examples

where(posts, 'data.draft', false);
where(posts, 'data.featured'); // truthy-only

pluck(value, keyOrFn)

Project an array of objects onto a single key or dot-path.

Parameters

Name Type Default Description
value readonly T[]
keyOrFn string | ((item: T) => unknown)

Returns

unknown[]

Examples

// ['Hello', 'World']
pluck([{ title: 'Hello' }, { title: 'World' }], 'title');
{{ collections.posts | pluck('data.title') | join(', ') }}

Allons-y Studio

Let's build something great together

A front-end & design systems studio helping teams ship consistent, accessible UI faster.