Categories
JavaScript Answers

How to Paginate a JavaScript Array?

Spread the love

Sometimes, we want to paginate a JavaScript array.

In this article, we’ll look at how to paginate a JavaScript array.

Paginate a JavaScript Array

To paginate a JavaScript array, we can use the slice method to return the chunk of the array we want.

For instance, we can write:

const arr = Array(100).fill().map((_, i) => i)
const paginate = (array, pageSize, pageNumber) => {
  return array.slice((pageNumber - 1) * pageSize, pageNumber * pageSize);
}
console.log(paginate(arr, 10, 1))
console.log(paginate(arr, 10, 2))
console.log(paginate(arr, 10, 3))

We have the arr array with 100 entries.

Then we create paginate function that takes the array , pageSize and pageNumber parameters.

pageNumber starts from 1, so we call slice with (pageNumber — 1) * pageSize as the first argument and pageNumber * pageSize as the 2nd argument to return the slice according to a human-readable page number.

Then from the console log, we see:

[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
[10, 11, 12, 13, 14, 15, 16, 17, 18, 19]
[20, 21, 22, 23, 24, 25, 26, 27, 28, 29]

as the returned values of paginate with pageSize 10 and pageNumber 1, 2, and 3 respectively.

Conclusion

To paginate a JavaScript array, we can use the slice method to return the chunk of the array we want.

Leave a Reply

Your email address will not be published.

If you like the content of this blog, subscribe to my email list to get exclusive articles not available to anyone else.