loading...

Solving "Chunky Monkey" / freeCodeCamp Algorithm Challenges

virenb profile image Viren B Originally published at virenb.cc ・4 min read

Solving freeCodeCamp's Algorithm Challenges (37 Part Series)

1) FCC Algorithm Challenges / Convert Celsius to Fahrenheit 2) FCC Algorithm Challenges / Reverse a String 3 ... 35 3) FCC Algorithm Challenges / Factorialize a Number 4) FCC Algorithm Challenges / Find the Longest Word in a String 5) FCC Algorithm Challenges / Return Largest Numbers in Arrays 6) Solving "Confirm the Ending" / FreeCodeCamp Algorithm Challenges 7) Solving "Repeat a String Repeat a String" / FreeCodeCamp Algorithm Challenges 8) Solving "Truncate a String" / freeCodeCamp Algorithm Challenges 9) Solving "Finders Keepers" / freeCodeCamp Algorithm Challenges 10) Solving "Boo who" / freeCodeCamp Algorithm Challenges 11) Solving "Title Case a Sentence" / freeCodeCamp Algorithm Challenges 12) Solving "Slice and Splice" / freeCodeCamp Algorithm Challenges 13) Solving "Falsy Bouncer" / freeCodeCamp Algorithm Challenges 14) Solving "Where do I Belong" / freeCodeCamp Algorithm Challenges 15) Solving "Mutations" / freeCodeCamp Algorithm Challenges 16) Solving "Chunky Monkey" / freeCodeCamp Algorithm Challenges 17) Solving "Sum All Numbers in a Range" / freeCodeCamp Algorithm Challenges 18) Solving "Diff Two Arrays" / freeCodeCamp Algorithm Challenges 19) Solving "Seek and Destroy" / freeCodeCamp Algorithm Challenges 20) Solving "Wherefore art thou" / freeCodeCamp Algorithm Challenges 21) Solving "Spinal Tap Case" / freeCodeCamp Algorithm Challenges 22) Solving "Pig Latin" / freeCodeCamp Algorithm Challenges 23) Solving "Search and Replace" / freeCodeCamp Algorithm Challenges 24) Solving "DNA Pairing" / freeCodeCamp Algorithm Challenges 25) Solving "Missing letters" / freeCodeCamp Algorithm Challenges 26) Solving "Sorted Union" / freeCodeCamp Algorithm Challenges 27) Solving "Convert HTML Entities" / freeCodeCamp Algorithm Challenges 28) Solving "Sum All Odd Fibonacci Numbers" / freeCodeCamp Algorithm Challenges 29) Solving "Sum All Primes" / freeCodeCamp Algorithm Challenges 30) Solving "Smallest Common Multiple" / freeCodeCamp Algorithm Challenges 31) Solving "Drop it" / freeCodeCamp Algorithm Challenges 32) Solving "Steamroller" / freeCodeCamp Algorithm Challenges 33) Solving "Binary Agents" / freeCodeCamp Algorithm Challenges 34) Solving "Everything Be True" / freeCodeCamp Algorithm Challenges 35) Solving "Arguments Optional" / freeCodeCamp Algorithm Challenges 36) Solving "Make a Person" / freeCodeCamp Algorithm Challenges 37) Solving "Map the Debris" / freeCodeCamp Algorithm Challenges

"Chunky Monkey"

Let's solve freeCodeCamp's basic algorithm scripting challenge, 'Chunky Monkey'.

Starter Code

function chunkArrayInGroups(arr, size) {
  return arr;
}

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

Instructions

Write a function that splits an array (first argument) into groups the length of size (second argument) and returns them as a two-dimensional array.

Tests

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]].

Our Approach

Read everything first. Read the instructions clearly, read the starter code we're given, and read the tests and understand what has to be returned.

  • The function takes two arguments, arr being an array and size being a number.
  • We need to evaluate size and create sub-arrays with a length of size.
  • We need to return a two-dimensional array.

Now that we understand what we are given and what we want to output, let's see how we can solve this.

Our plan of action will definitely involving a loop of arr. We need to figure out how and when to split into a sub-array.

From previous challenges, we know that splice() method can alter our arr and return a new array.

MDN: Array.splice()

Just a quick reminder of how splice() works:

"The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place."

// Let's delete 3, 4
[1, 2, 3, 4].splice(2, 2)
Going to 2nd index and removing 2 items
[3, 4]

Since splice() returns an array, we can save it with a variable, then insert it back into arr.

We have a better idea on slicing now, we can create our for loop but how should we call slice()?

for (let i = 0; i < arr.length; i++) {
    let toSplice = arr.splice(i, size)
    ...
}

We will call splice with splice(i, size) as size is the value of how big our new arrays should be.

Taking a test case for example:

chunkArrayInGroups([0, 1, 2, 3, 4, 5], 3) should return [[0, 1, 2], [3, 4, 5]

for (let i = 0; i < arr.length; i++) {
    let toSplice = arr.splice(i, size)
    ...
}

First loop:
    i = 0
    size = 3
    toSplice = [0, 1, 2]
    arr = [3, 4, 5]

Second loop:
    i = 1
    size = 3
    toSplice = [4, 5]
    arr = [3]   

So, we are on the right track but on the second loop, it starts to take the wrong direction.

Another Array method will be of much use now, unshift().

"The unshift() method adds one or more elements to the beginning of an array and returns the new length of the array."

MDN: Array.unshift()

We want to splice, then unshift.

arr.unshift(toSplice);

It will add the new array to the front of arr.

Once we add unshift(), our first loop will look like the following:

chunkArrayInGroups([0, 1, 2, 3, 4, 5], 3) should return [[0, 1, 2], [3, 4, 5]

for (let i = 0; i < arr.length; i++) {
    let toSplice = arr.splice(i, size);
    arr.unshift(toSplice);
}

First loop:
    i = 0
    size = 3
    toSplice = [0, 1, 2]
    arr = [[0, 1, 2], 3, 4, 5]

I would call this sucessful. We are slowly creating out desired 2D array.

Our second loop would look like:

Second loop:
    i = 1
    size = 3
    toSplice = [3, 4, 5]
    arr = [ [ 3, 4, 5 ], [ 0, 1, 2 ] ]

The only issue is the sub-arrays are in reverse order.

We have another method we can use, reverse().

MDN: Array.reverse()

[[ 3, 4, 5 ], [ 0, 1, 2 ] ].reverse()
Result: [[0, 1, 2], [3, 4, 5]]

Always make sure to return!


Our Solution [SPOILER: CONTAINS ANSWER]

function chunkArrayInGroups(arr, size) {
  for (let i = 0; i < arr.length; i++) {
    let toSplice = arr.splice(i, size);
    arr.unshift(toSplice);
  }
  return arr.reverse();
}

Links & Resources

'Chunky Monkey' Challenge on fCC

freeCodeCamp

Donate to FCC!

Solution on my GitHub

Thank you for reading!

Solving freeCodeCamp's Algorithm Challenges (37 Part Series)

1) FCC Algorithm Challenges / Convert Celsius to Fahrenheit 2) FCC Algorithm Challenges / Reverse a String 3 ... 35 3) FCC Algorithm Challenges / Factorialize a Number 4) FCC Algorithm Challenges / Find the Longest Word in a String 5) FCC Algorithm Challenges / Return Largest Numbers in Arrays 6) Solving "Confirm the Ending" / FreeCodeCamp Algorithm Challenges 7) Solving "Repeat a String Repeat a String" / FreeCodeCamp Algorithm Challenges 8) Solving "Truncate a String" / freeCodeCamp Algorithm Challenges 9) Solving "Finders Keepers" / freeCodeCamp Algorithm Challenges 10) Solving "Boo who" / freeCodeCamp Algorithm Challenges 11) Solving "Title Case a Sentence" / freeCodeCamp Algorithm Challenges 12) Solving "Slice and Splice" / freeCodeCamp Algorithm Challenges 13) Solving "Falsy Bouncer" / freeCodeCamp Algorithm Challenges 14) Solving "Where do I Belong" / freeCodeCamp Algorithm Challenges 15) Solving "Mutations" / freeCodeCamp Algorithm Challenges 16) Solving "Chunky Monkey" / freeCodeCamp Algorithm Challenges 17) Solving "Sum All Numbers in a Range" / freeCodeCamp Algorithm Challenges 18) Solving "Diff Two Arrays" / freeCodeCamp Algorithm Challenges 19) Solving "Seek and Destroy" / freeCodeCamp Algorithm Challenges 20) Solving "Wherefore art thou" / freeCodeCamp Algorithm Challenges 21) Solving "Spinal Tap Case" / freeCodeCamp Algorithm Challenges 22) Solving "Pig Latin" / freeCodeCamp Algorithm Challenges 23) Solving "Search and Replace" / freeCodeCamp Algorithm Challenges 24) Solving "DNA Pairing" / freeCodeCamp Algorithm Challenges 25) Solving "Missing letters" / freeCodeCamp Algorithm Challenges 26) Solving "Sorted Union" / freeCodeCamp Algorithm Challenges 27) Solving "Convert HTML Entities" / freeCodeCamp Algorithm Challenges 28) Solving "Sum All Odd Fibonacci Numbers" / freeCodeCamp Algorithm Challenges 29) Solving "Sum All Primes" / freeCodeCamp Algorithm Challenges 30) Solving "Smallest Common Multiple" / freeCodeCamp Algorithm Challenges 31) Solving "Drop it" / freeCodeCamp Algorithm Challenges 32) Solving "Steamroller" / freeCodeCamp Algorithm Challenges 33) Solving "Binary Agents" / freeCodeCamp Algorithm Challenges 34) Solving "Everything Be True" / freeCodeCamp Algorithm Challenges 35) Solving "Arguments Optional" / freeCodeCamp Algorithm Challenges 36) Solving "Make a Person" / freeCodeCamp Algorithm Challenges 37) Solving "Map the Debris" / freeCodeCamp Algorithm Challenges

Posted on by:

virenb profile

Viren B

@virenb

Self-taught developer, always looking to learn more.

Discussion

markdown guide
 

Another way:

const chunkArrayInGroups = (arr,  size) =>
  arr
  .flatMap(
    (_, i, a) => 
      i % size === 0 ? [ a.slice(i, i + size) ] 
      : []
  )
 

Nice, more modern approach!