Chunky Monkey

In the freeCodeCamp algorithm our goal is to create a function that splits ✂️ an array, arr, into groups of a given length, size. It should then return the result as a 2-dimensional array. A 2D array is essentially an array of arrays.

Requirements 🙈

chunkArrayInGroups(["a", "b", "c", "d"], 2) should return [["a", "b"], ["c", "d"]]
chunkArrayInGroups([0, 1, 2, 3, 4, 5], 3) should return [[0, 1, 2], [3, 4, 5]]
chunkArrayInGroups([0, 1, 2, 3, 4, 5], 2) should return [[0, 1], [2, 3], [4, 5]]
chunkArrayInGroups([0, 1, 2, 3, 4, 5], 4) should return [[0, 1, 2, 3], [4, 5]]
chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6], 3) should return [[0, 1, 2], [3, 4, 5], [6]]
chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 4) should return [[0, 1, 2, 3], [4, 5, 6, 7], [8]]
chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2) should return [[0, 1], [2, 3], [4, 5], [6, 7], [8]]

Psuedocode 🙉

Let's take a look at how we can break this algorithm down into smaller, more digestible chunks. 🐒

// create a function that accepts 2 arguments, arr and size
    // create an array that will hold our result
    // create an array to temporarily hold items as we loop through arr
    
    // loop through arr
        // check first if the length of temp is equal to size
        // if so, add temp to res
        // reset temp back to an empty array
        
        // push item from arr to temp through each pass of the loop
        
      // push temp to res once loop has completed
      
      // return res

Solving the Algorithm 🙊

Setting up our function

I've included the boilerplate function that's used on freeCodeCamp. Let's also add res, the array that will store the final result, and temp which we will use to create the sub-arrays within our main array.

function chunkArrayInGroups(arr, size) {
  // Break it up.
  
  var res = []; // stores the final result
  var temp = []; // used to store the sub-arrays that will be pushed to res
 
  return arr;
}

chunkArrayInGroups(["a", "b", "c", "d"], 2);

Looping through the items in arr

Now that we have the framework of our function setup, let's work on the logic that will loop over each item in arr, and create sub-arrays of length size.

function chunkArrayInGroups(arr, size) {
  // Break it up.
  
  var res = []; // stores the final result
  var temp = []; // used to store the sub-arrays that will be pushed to res
 
  for (var i in arr) {
  
    if (temp.length === size) { // Once temp equals size
		res.push(temp); // Push temp to res
		temp = []; // Reset temp
	}
    
    temp.push(arr[i]); // Push arr items to temp
  
  }
 
  return arr;
}

chunkArrayInGroups(["a", "b", "c", "d"], 2);

Push all temp's to res

The last thing we really need to do here is make sure that as soon as temp is equal to size we push it directly to res, and continue doing that until we've looped through all of the items in arr. Then we just need to return res and we're done.

function chunkArrayInGroups(arr, size) {
  // Break it up.
  
  var res = []; // stores the final result
  var temp = []; // used to store the sub-arrays that will be pushed to res
 
  for (var i in arr) {
  
    if (temp.length === size) { // Once temp equals size
		res.push(temp); // Push temp to res
		temp = []; // Reset temp
	}
    
    temp.push(arr[i]); // Push arr items to temp
  }
  res.push(temp); // Push remaining items to res
 
  return res;
}

chunkArrayInGroups(["a", "b", "c", "d"], 2); // should return [["a", "b"], ["c", "d"]]
// chunkArrayInGroups([0, 1, 2, 3, 4, 5], 3); // should return [[0, 1, 2], [3, 4, 5]]
// chunkArrayInGroups([0, 1, 2, 3, 4, 5], 2) // should return [[0, 1], [2, 3], [4, 5]]
// chunkArrayInGroups([0, 1, 2, 3, 4, 5], 4) // should return [[0, 1, 2, 3], [4, 5]]
// chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6], 3) // should return [[0, 1, 2], [3, 4, 5], [6]]
// chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 4) // should return [[0, 1, 2, 3], [4, 5, 6, 7], [8]]
// chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2) // should return [[0, 1], [2, 3], [4, 5], [6, 7], [8]]

Try this the code snippet in your browser console.

Hell Yeah 🦍

Awesome - You made it! Hopefully you found this to be a helpful walkthrough on the freeCodeCamp algorithm, 'Chunky Monkey'. Feel free to send me your suggestions or solutions and I'd be happy to feature them here!

Shoot me an email at [email protected] with any questions and if you enjoyed this, stay tuned and subscribe below! 👇