How to Chunk an Array with JavaScript

In this article, we’ll explore another common interview question for JavaScript developers – Chunk an Array. Now, like all of these interview questions, this one is not so complicated. Make sure to study the examples before attempting to solve the problem

Introduction

We’re going to start off with the following function:

function chunk(arr, size) {
  // Your code here
}

Using the two arguments, we want to divide the array into subarrays where each sub array is of length size. Put simply, we’re taking one big array and splitting it into many smaller sub arrays that are all contained within one larger array.

Examples & Directions

Directions: Given an array and chunk size, divide the array into many subarrays where each subarray is of length size

Examples:

  1. chunk([1, 2, 3, 4], 2) --> [[ 1, 2], [3, 4]]
  2. chunk([1, 2, 3, 4, 5], 2) --> [[ 1, 2], [3, 4], [5]]
  3. chunk([1, 2, 3, 4, 5, 6, 7, 8], 3) --> [[ 1, 2, 3], [4, 5, 6], [7, 8]]
  4. chunk([1, 2, 3, 4, 5], 4) --> [[ 1, 2, 3, 4], [5]]
  5. chunk([1, 2, 3, 4, 5], 10) --> [[ 1, 2, 3, 4, 5]]

Looking at the examples, you should notice a pattern. Notice that the number passed in after the array is specifying how many elemnts go into each subarray. It’s not specifying the total number of chunks, just the amount of elements that go the chunk.

For example, look at 1. chunk([1, 2, 3, 4], 2) --> [[ 1, 2], [3, 4]]. The specifier is the number 2 after the array [1, 2, 3, 4].

Take a look at example 2. chunk([1, 2, 3, 4, 5], 2) --> [[ 1, 2], [3, 4], [5]]. Notice there’s not enough elements in the array to make three subarrays with 2 elements in all of them. The loner, 5, will be stored within it’s on chunk. Likewise, examples 3, 4, and 5 mimic this same behavior. Therefore, if you have a lone element, simply store it in it’s own chunk.

NOTE: Try to solve the problem on your own before viewing the solutions.

Solution 1

function chunk(array, size) {
  const chunked = [];
  let index = 0;

  while (index < array.length) {
    chunked.push(array.slice(index, index + size));
    index += size;
  }
  return chunked;
}

console.log(chunk([1, 2, 3, 4], 2) --> [[ 1, 2], [3, 4]]);

Solution 2

function chunk(array, size) {
  const chunked = [];

  for (let element of array) {
    const last = chunked[chunked.length - 1];

    if (!last || last.length === size) {
      chunked.push([element]);
    } else {
      last.push(element);
    }
  }
  return chunked;
}
console.log(chunk([1, 2, 3, 4], 2) --> [[ 1, 2], [3, 4]]);
comments powered by Disqus

Related Posts

The Art of Data Visualization: Exploring D3.js

Data is everywhere, flowing into our applications from various sources at an unprecedented rate. However, raw data alone holds little value unless it can be transformed into meaningful insights.

Read more

JavaScript’s Secret Weapon: Supercharge Your Web Apps with Web Workers

During an interview, I was asked how we could make JavaScript multi-threaded. I was stumped, and admitted I didn’t know… JavaScript is a single-threaded language.

Read more

Creating a NodeJS Budgeting Tool

In this article, we’re going to show you how to read and write to a .txt file using NodeJS by creating a small budgeting CLI (Command Line Interface).

Read more