Chunky Monkey - so many strange results

JavaScript
#1

There are so many things wrong with my code (as per console.log).

  1. This code:
    console.log("This is end: " + size+i);
    returns 20 instead of 2 when i = 0 and size = 2.

  2. Even weirder, this code:
    arr1.push(arr.slice(i,size+i));
    seems to know that size + i = 2 because the result from
    console.log("This is arr1: " + arr1);
    is the first 2 elements of the array.

So that’s really weird and is confusing.

My 2nd problem: Everytime I go through the loop, arr1 gets the next 2 (if size = 2) elements added so by the time the loop is done, I end up with arr = arr1. So how do I save off the results of one slice so that it doesn’t get overwritten when the loop runs again?

Your code so far

// Attempt # 1
function chunkArrayInGroups(arr, size) {
  // Break it up.
//   console.log(arr.length, size);
  var arr1 = [];
  
//   Loop through original array to break it up into chunks using slice:
  for (i=0; i<=arr.length; i = i+size){
      console.log("This is array length: " + arr.length);
      console.log("This is begin: " + i);
      console.log("This is end: " + size+i);
      console.log("This is array: " + arr);
      console.log(arr.slice(i,size+i));
      arr1.push(arr.slice(i,size+i));
      console.log("This is arr1: " + arr1);
  }
     return arr1;
}

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

Your browser information:

Your Browser User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36.

Link to the challenge:
https://www.freecodecamp.org/challenges/chunky-monkey

#2

Blockquote
This code:
console.log("This is end: " + size+i);
returns 20 instead of 2 when i = 0 and size = 2.

That’s normal - the log parses them as strings and concats them together.
This naturally then prints "This is end: 20" - the 2 is from size, and the 0 is from i.

Blockquote
Even weirder, this code:
arr1.push(arr.slice(i,size+i));
seems to know that size + i = 2 because the result from
console.log("This is arr1: " + arr1);
is the first 2 elements of the array.

Yes… you have size+i there, which is indeed 2 at the start! :slight_smile:

Blockquote
Everytime I go through the loop, arr1 gets the next 2 (if size = 2) elements added so by the time the loop is done, I end up with arr = arr1. So how do I save off the results of one slice so that it doesn’t get overwritten when the loop runs again?

I’m not sure I understand what/why you’re asking here - we want to continue getting the next slice. You are not in fact getting arr1 = arr here - you’re getting an array with pairs inside. I just tried running it, it works for me? (with the exception of the below point)

The only thing that’s really wrong here is the i<=arr.length. Consider: the length of your test case array is 4, but what is the fourth element? (hint: array indices start at 0)

1 Like
#3

Thank you @gebulmer.

I updated the for loop so that
i<=arr.length
became:
i<=arr.length-1

I also got rid of all but one of the console.log statements so now I only see what the function returns. New code:

function chunkArrayInGroups(arr, size) {
  // Break it up.
//   console.log(arr.length, size);
  var arr1 = [];
  
//   Loop through original array to break it up into chunks using slice:
  for (i=0; i<=arr.length-1; i = i+size){
//       console.log("This is array length: " + arr.length);
//       console.log("This is begin: " + i);
//       console.log("This is end: " + size+i);
//       console.log("This is array: " + arr);
//       console.log(arr.slice(i,size+i));
      arr1.push(arr.slice(i,size+i));
//       console.log("This is arr1: " + arr1);
  }
     console.log("This is arr1: " + arr1);
     return arr1;
}

And all test-cases are passing now. But I am still confused.

The console.log is returning the following for the first 2 test-cases:
This is arr1: a,b,c,d
This is arr1: 0,1,2,3,4,5

But isn’t this the right answer:
This is arr1: [a,b],[c,d]
This is arr1: [0, 1, 2], [3, 4, 5]

#4

You should use i < arr.length instead imo, it’s more natural and more commonly found.

Ahah you’ve fallen afoul of the string coercing thing again! There can be a lot of surprises here at first

Check for yourself in the console with the following commands:

console.log([1,2,3,4,5]);
console.log("This is: " + [1,2,3,4,5]);
console.log("And now nested ones: " + [[1, 2], [3, 4], [5]]);

1 Like
#5

Ah I see. Console.log is not as straightforward as I had thought. Thank you for your help!

#6

If you want to use console.log to display some text plus an array or object you can use JSON.stringify. See below:

var arr = [[1, 2], [3, 4], [5]];
console.log("And now nested ones: " + JSON.stringify(arr));

The above displays the following to the console:

And now nested ones: [[1,2],[3,4],[5]]

1 Like
#7