Skip to content

Home

Get N elements from the start or end of a JavaScript array

A very common scenario when working with arrays is to get a subset of elements from the start or end of the array. Depending on the use-case and the desired result, there are a few variants of this operation that might fit your needs.

Get the first N elements of an array

Starting simple, you might want to get the first N elements of an array. Using Array.prototype.slice() you can easily achieve this by passing 0 as the starting index and n as the ending index.

const take = (arr, n = 1) => arr.slice(0, n);

take([1, 2, 3], 0); // []
take([1, 2, 3], 2); // [1, 2]
take([1, 2, 3], 5); // [1, 2, 3]

As you can see from these examples, Array.prototype.slice() is versatile enough to handle values of n that would be well outside the array. This means that if the value of Array.prototype.length is less than or equal to n, all elements in the array will be retrieved.

Negative values are a little odd, as you will end up getting all values between 0 and the nth to last element. If you want to avoid that behavior, you could simply add some code to validate that n is greater than or equal to 0 and throw an error otherwise.

Get the last N elements of an array

Getting the last N elements of an array is pretty similar. Passing a negative index to Array.prototype.slice() is all that's necessary to make this work.

const takeRight = (arr, n = 1) => arr.slice(-n);

takeRight([1, 2, 3], 2); // [2, 3]
takeRight([1, 2, 3], 0); // [1, 2, 3] - Huh?
takeRight([1, 2, 3], 5); // [1, 2, 3]

While this works in most cases, passing a value of 0 for n will result in the retrieval of all array elements. You can mitigate this by using Array.prototype.length to always pass two positive values to Array.prototype.slice().

const takeRight = (arr, n = 1) => arr.slice(arr.length - n, arr.length);

takeRight([1, 2, 3], 2); // [2, 3]
takeRight([1, 2, 3], 0); // []
takeRight([1, 2, 3], 5); // [2, 3] - Huh?

This variant ends up breaking in case n is greater than the length of the array, which isn't great. Instead of overly complex solutions, including a ternary operator (?) in the original variant should be more than enough.

const takeRight = (arr, n = 1) => n === 0 ? [] : arr.slice(-n);

takeRight([1, 2, 3], 2); // [2, 3]
takeRight([1, 2, 3], 0); // []
takeRight([1, 2, 3], 5); // [1, 2, 3]

Again, negative values will result in an odd behavior, so you might want to add some validation code to prevent that.

More like this

Start typing a keyphrase to see matching snippets.