Split array into chunks

Question

Let's say that I have an Javascript array looking as following:

["Element 1","Element 2","Element 3",...]; // with close to a hundred elements. 

What approach would be appropriate to chunk (split) the array into many smaller arrays with, lets say, 10 elements at its most?

Answer 1

The array.slice method can extract a slice from the beginning, middle, or end of an array for whatever purposes you require, without changing the original array.

var i,j, temporary, chunk = 10; for (i = 0,j = array.length; i < j; i += chunk) {     temporary = array.slice(i, i + chunk);     // do whatever } 

Answer 2

Here's a ES6 version using reduce

var perChunk = 2 // items per chunk      var inputArray = ['a','b','c','d','e']  var result = inputArray.reduce((resultArray, item, index) => {    const chunkIndex = Math.floor(index/perChunk)    if(!resultArray[chunkIndex]) {     resultArray[chunkIndex] = [] // start a new chunk   }    resultArray[chunkIndex].push(item)    return resultArray }, [])  console.log(result); // result: [['a','b'], ['c','d'], ['e']]

And you're ready to chain further map/reduce transformations. Your input array is left intact

---

If you prefer a shorter but less readable version, you can sprinkle some concat into the mix for the same end result:

inputArray.reduce((all,one,i) => {    const ch = Math.floor(i/perChunk);     all[ch] = [].concat((all[ch]||[]),one);     return all }, []) 

You can use remainder operator to put consecutive items into different chunks:

const ch = (i % perChunk);