Breaking down an array into groups - where did I go wrong in my code?

Question

Breaking down an array into groups - where did I go wrong in my code?

Check out the following code :

function splitArrayIntoGroups(arr, size) {
  // Splitting the array into groups.
  var newArray = [];
  for(var i = 0; i < arr.length; i++){
    for(var j = 0; j < size; j++){
      newArray.push(arr.splice(0, size));
    }
  }
  var finalResult = [];
  for(i = 0; i < newArray.length; i++){
    if(newArray[i].length != 0){
      finalResult.push(newArray[i]);
    }
  }
  return finalResult;
}

splitArrayIntoGroups([0, 1, 2, 3, 4, 5, 6, 7,8], 2);

The expected output is -

[[0, 1], [2, 3], [4, 5], [6, 7], [8]]

. However, it currently returns [[0, 1], [2, 3], [4, 5], [6, 7]]. Interestingly, if the input array is changed to ([0,1,2,3,4,5,6,7,8,9,10],2), the code works as intended.

P.S: The focus here is to identify and rectify the issue in this existing code rather than suggesting an entirely different approach or code snippet.

javascript arrays algorithm loops logic

Answer 1

Answer №1

Essentially, a single loop is all that is required as the array is spliced to extract chunks of the desired size.

This method lends itself well to looping until the array reaches a length of zero, at which point the loop can be exited.

With this approach, the final result is readily available.

function chunkArrayInGroups(arr, size) {
    var newArr = [];
    // for (var i = 0; i < arr.length; i++) {
    while (arr.length) {                        // add this for looping and checking
        // for (var j = 0; j < size; j++) {
        newArr.push(arr.splice(0, size));       // keep this for doing the work!
        // }
    }
    // var result = [];
    // for (i = 0; i < newArr.length; i++) {
    //     if (newArr[i].length != 0) {
    //         result.push(newArr[i]);
    //     }
    // }
    // return result;
    return newArr;                              // return only newArray
}

console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2));

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

Essentially, a single loop is all that is required as the array is spliced to extract chunks of the desired size.

This method lends itself well to looping until the array reaches a length of zero, at which point the loop can be exited.

With this approach, the final result is readily available.

function chunkArrayInGroups(arr, size) {
    var newArr = [];
    // for (var i = 0; i < arr.length; i++) {
    while (arr.length) {                        // add this for looping and checking
        // for (var j = 0; j < size; j++) {
        newArr.push(arr.splice(0, size));       // keep this for doing the work!
        // }
    }
    // var result = [];
    // for (i = 0; i < newArr.length; i++) {
    //     if (newArr[i].length != 0) {
    //         result.push(newArr[i]);
    //     }
    // }
    // return result;
    return newArr;                              // return only newArray
}

console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7, 8], 2));

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 3

Answer №2

To achieve the desired outcome, you can use the following code snippet:

let chunkSize = 2;
const originalArray = [0, 1, 2, 3, 4, 5, 6, 7, 8];
const newArray = [];
for (let index = 0; index < originalArray.length; index += chunkSize) {
    newArray.push(originalArray.slice(index, index + chunkSize));
}
console.log(newArray); // Output will be [[0, 1], [2, 3], [4, 5], [6, 7], [8]]

Answer 4

To achieve the desired outcome, you can use the following code snippet:

let chunkSize = 2;
const originalArray = [0, 1, 2, 3, 4, 5, 6, 7, 8];
const newArray = [];
for (let index = 0; index < originalArray.length; index += chunkSize) {
    newArray.push(originalArray.slice(index, index + chunkSize));
}
console.log(newArray); // Output will be [[0, 1], [2, 3], [4, 5], [6, 7], [8]]

Answer 5

Answer №3

Your issue lies in not accounting for the scenario where the items remaining in the array are fewer than the specified size. In other words, when arr.length < size, the remaining elements are not included in the chunk array.

To address this, I have made updates to your code to ensure it functions correctly:

function chunkArrayInGroups(arr, size) {
  // Break it up.
  var newArr =[];
  while(size<arr.length){
      newArr.push(arr.splice(0, size ));
  }
  if(arr.length<size){
      newArr.push(arr);
  }

}

Demo:

function chunkArrayInGroups(arr, size) {
  // Break it up.
  var newArr =[];
  while(size<arr.length){
      newArr.push(arr.splice(0, size));
  }
  if(arr.length<size){
      newArr.push(arr);
  }
  return newArr;
}

console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7,8], 2));

Note:

There is no need for utilizing the result array since it merely duplicates the newArr. You could simply return newArr instead of creating a copy.

Answer 6

Your issue lies in not accounting for the scenario where the items remaining in the array are fewer than the specified size. In other words, when arr.length < size, the remaining elements are not included in the chunk array.

To address this, I have made updates to your code to ensure it functions correctly:

function chunkArrayInGroups(arr, size) {
  // Break it up.
  var newArr =[];
  while(size<arr.length){
      newArr.push(arr.splice(0, size ));
  }
  if(arr.length<size){
      newArr.push(arr);
  }

}

Demo:

function chunkArrayInGroups(arr, size) {
  // Break it up.
  var newArr =[];
  while(size<arr.length){
      newArr.push(arr.splice(0, size));
  }
  if(arr.length<size){
      newArr.push(arr);
  }
  return newArr;
}

console.log(chunkArrayInGroups([0, 1, 2, 3, 4, 5, 6, 7,8], 2));

Note:

There is no need for utilizing the result array since it merely duplicates the newArr. You could simply return newArr instead of creating a copy.

Breaking down an array into groups - where did I go wrong in my code?

Answer №1

Answer №2

Answer №3

Similar questions

Is there a way to identify the index of user input when using the .map method?

Utilizing numerous X-axis data points in highcharts

Exploring the transparency of material lab autocomplete drop-down text for enabling multiple selections

What is the most effective method to include JSON data containing various IDs at the end within an $http.get() request in AngularJS?

The default action is not triggered when the click event occurs

Tips on preventing form submission when clicking on another button within the same form

The sort function in Reactjs does not trigger a re-render of the cards

Converting JSON HTTP response to an Array in AngularJS 2: A Comprehensive Guide

Integrate CSS and JavaScript files into Node Express

Managing global errors and intercepting requests in AngularJS can be easily achieved by utilizing $resource interceptors and global handlers for

Ionic ion-view missing title issue

How can I verify if an unsupported parameter has been passed in a GET request using Express/Node.js?

Angular JS presents an exciting feature called Multiple Filters, which allows

Setting a displacement/normal map for only one face of a cylinder

Using a physical Android device to test and run a Meteor mobile application

"Utilize parameter passing with mapGetters in the Vuex state management system

Creating a dynamic progress bar that scrolls for multiple elements

What is the best way to manage a significant volume of "business" data or objects within my JavaScript project?

Access an external URL by logging in, then return back to the Angular application

Add an extra filter solely to a single item within the ng-repeat directive