Make nested array to group array elements

Question

I have array:

arr = [1,2,3,4,5,6,7,8,9,10,11,12,13,14];

Then I want to make group of 4 elements. Every iteration, this array must be modified until it get's final face.

Step 1:

arr = [[1,2,3,4],5,6,7,8,9,10,11,12,13,14];

Step 2:

arr = [[1,2,3,4],[5,6,7,8],9,10,11,12,13,14];

Step 3:

arr = [[1,2,3,4],[5,6,7,8],[9,10,11,12],13,14];

Step 3:

arr = [[1,2,3,4],[5,6,7,8],[9,10,11,12],[13,14]];

How is this possible?

I tried this:

var array = [1,2,3,4,5,6,7,8,9,10,11,12,13,14]
var i,j,temparray,chunk = 4;
for (i=0,j=array.length; i<j; i+=chunk) {
    temparray = array.slice(i,i+chunk);
    console.log(temparray);
}

But I don't know then how to save this chunk into own array and not in the new array.

Please provide the code you've already tried and we'd be happy to help you get it working. — Rob Johansen
– Rob Johansen, Commented Nov 20, 2017 at 17:22
what is with your 4 step approach? now in one (in the accepted answer)? if so, please change the question. — Nina Scholz
– Nina Scholz, Commented Nov 20, 2017 at 18:17
@NinaScholz every 4 element must be splitted and saved in one array, so left elements are less than 4 and we must save it to use later. — userProfile
– userProfile, Commented Nov 20, 2017 at 18:20

Mohamed Abbas · Accepted Answer · 2017-11-20 17:33:51Z

3

Using Array#reduce method.

const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14], 
newArr = arr.reduce((acc, item, index) => {
    if ((index) % 4 === 0) {
        acc.push([item]);
    } else {
        acc[acc.length - 1].push(item);
    }
    return acc;
}, []);

console.log(newArr); // [ [ 1, 2, 3, 4 ], [ 5, 6, 7, 8 ], [ 9, 10, 11, 12 ], [ 13, 14 ] ]

answered Nov 20, 2017 at 17:33

Mohamed Abbas

2,3081 gold badge14 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Nina Scholz · Accepted Answer · 2017-11-20 18:20:20Z

3

You could splice the array until the length is smaller than the index of the last insertation.

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14],
    i = 0;
    
while (i < array.length) {
    array.splice(i, 0, array.splice(i, 4));
    console.log(JSON.stringify(array));
    i++;
}

edited Nov 20, 2017 at 18:20

answered Nov 20, 2017 at 17:30

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Comments

U Rogel · Accepted Answer · 2017-11-20 17:31:24Z

2

lodash probably has better performances than my implementation, but if you are looking to do so with vanilla javascript then you can like this (though many other ways are possible):

var arr = [1,2,3,4,5,6,7,8,9,10,11,12,13,14];

var newArr = arr.reduce((acc, val, idx)=>{
	if(idx % 4 === 0){
  	acc.push([]);
  }
  acc[acc.length-1].push(val)
  return acc
}, [])

console.log(newArr);

answered Nov 20, 2017 at 17:31

U Rogel

1,95117 silver badges31 bronze badges

3 Comments

Jonas Wilms Over a year ago

VanillaJS beats everything!

U Rogel Over a year ago

I was sure lodash would make it faster than my code, but after several checks on jsfiddle I was 3-5 times faster than lodash!!! :)

Dancrumb Over a year ago

VanillaJS only beats everything if you have the skills and experience to write faster and safer code that the author of a well-tested and widely used library.

Dancrumb · Accepted Answer · 2017-11-20 17:23:20Z

1

The lodash method chunk will do this for you.

result = _.chunk(arr, 4);

answered Nov 20, 2017 at 17:23

Dancrumb

27.7k10 gold badges79 silver badges139 bronze badges

Comments

user8933532 · Accepted Answer · 2017-11-20 17:30:09Z

1

function chunkArray(myArray, chunk_size){
    var index = 0;
    var arrayLength = myArray.length;
    var tempArray = [];

    for (index = 0; index < arrayLength; index += chunk_size) {
        myChunk = myArray.slice(index, index+chunk_size);
        // Do something if you want with the group
        tempArray.push(myChunk);
    }

    return tempArray;
}
// Split in group of 3 items
var result = chunkArray([1,2,3,4,5,6,7,8], 3);
// Outputs : [ [1,2,3] , [4,5,6] ,[7,8] ]
console.log(result);

answered Nov 20, 2017 at 17:30

user8933532

314 bronze badges

1 Comment

Vipin Kumar Over a year ago

Please try to understand the question properly. User is asking to save the array in place and don't want new array.

Jonas Wilms · Accepted Answer · 2017-11-20 17:32:59Z

1

Just push it to the resulting array:

const chunk = 4, result = []
for (var i = 0, j = array.length; i < j; i += chunk) {
   result.push(array.slice(i,i  + chunk));
}

answered Nov 20, 2017 at 17:32

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Comments

Muhammad Soliman · Accepted Answer · 2017-11-20 18:48:47Z

1

I thought it would be fun too if I add one more solution using recursive calls, Happy coding!

Test it here

function split(arr, offset, res){ 
  
  //stop condition (offset exceeds len of array) 
  if(offset>arr.length) 
	return res; 

  //slice 4 elms 
  res.push(arr.slice(offset,offset+4)); 

  //recursion 
  return split(arr, offset+4, res);
  
}
  
var res = split([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14], 0, []);

console.log(res);

answered Nov 20, 2017 at 18:48

Muhammad Soliman

24k6 gold badges115 silver badges81 bronze badges

Collectives™ on Stack Overflow

Make nested array to group array elements

7 Answers 7

Comments

Comments

3 Comments

Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

Comments

3 Comments

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related