A Run Through of Array Chunks in Stephen Grider’s The Coding Bootcamp

Hey Albert, this is for you!

Short story: I met Albert in a chat room for React developers in Lagos. We went on to meet at ConcatenateConf (if you missed that, you need to go out in the rain tonight and your developer career path through). We hit off immediately because we had a lot of shared interests and to cap it off, we both had immediate plans to join the best freelancing platform we could. Toptal came to mind and we logically decided to combine our energies like Voltron for that ultimate Bazinger, and man, what a ride it has been!

nobody ever did colour blocking quite like Voltron in my estimation

This post is my attempt to explain the inner workings of the Array Chunks algorithm where two arguments are fed into function — array and size — that should go on to sort an array into sizes. Here goes.

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;
}
module.exports = chunk;

The array accepts two parameters and these proved to be very important to me understanding the logic behind it all. Right beneath the function declaration, what is done is to create an empty array that will house the chunked array — note the ‘chunked’ name.

Next up, we implement the for of loop. Now i consider this loop to be a massive improvement over the old guard for loop, but i definitely understand when a number of devs speak of problems with this improved version. TBH, it is a little fluid, but by God, i totally love the viscosity.

open that picture and you will see it is of a guy surfing a wave while riding a bicycle. and you think javascript is hard. heh.

The loop simply says, for every element — this is an self defined variable — of the array, let the last value in the already initialized chunked array be assigned to a variable called last.

This bears repeating: the last variable in the array chunked is made to equal last. But there is no last variable assigned the beginning, you say. Glad you noticed that, cos there is the magic, my friend.

houdini

Next 4 lines go on to use this new chakra, and i will have them printed out ‘cos they come off a little wonky at first, but hold on, i promise you will get it.

if (!last || last.length === size) {
chunked.push([element]);
} else {
last.push(element);
}

The if statement simply says that if there is no last (told you i would use that thing) or the last is equal to the size parameter taken in over at the function, the element would be pushed into the array chunked (seems straight forward to me, but a particular trouble spot i see may be the use of the size parameter — please let me know if i can explain more on it in the comment section. Please?) else the the const last pushes an element

To cap it off, we simply return the new array chunked with all the pretty new chunked arrays. Get at me through IM or through the comments section and lets talk through it.

Onwards and Upwards!