Split a two-dimensional array of specified length

Issue

Split the original array into a two-dimensional array of the specified length

list => source array

columns => columns number

targetList => two-dimensional array

const list = [1,2,3,4,5,6,7,8,9,10]
const columns = 4;
const targetList = [ [1,2,3], [4,5,6], [7,8,9], [10] ];

const columns = 5;
const targetList = [ [1,2], [3,4], [5,6], [7,8], [9,10] ];

const columns = 6;
const targetList = [ [1,2], [3,4], [5,6], [7,8], [9], [10] ];

const list = [1,2,3,4,5,6]
const columns = 4;
const targetList = [ [1,2], [3,4], [5], [6] ];

const list = [1,2,3,4]
const columns = 5;
const targetList = [ [1], [2], [3], [4] ];

Solution

You can use Array.prototype.reduce and transform the given list to the desired grid.

Push the a new row to the resultant grid if any of the following conditions meet:

1. If there are no rows currently.
2. If the last row is filled i.e. no more columns can be added to the last row, then add a new row with the current item.
3. If items remaining to be pushed becomes equal to rows remaining to be created.

const transform = (list, rows) =>
  list.reduce((t, l, i) => {
    if (
      !t.length ||
      t.at(-1).length >= Math.ceil(list.length / rows) ||
      list.length - i === rows - t.length
    ) {
      t.push([]);
    }
    t.at(-1).push(l);
    return t;
  }, []);

console.log(transform([1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 4));
console.log(transform([1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 5));
console.log(transform([1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 6));
console.log(transform([1, 2, 3, 4, 5, 6], 4));
console.log(transform([1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 4));
console.log(transform([1, 2, 3, 4], 5));

Other relevant documentations:

• Array.prototype.at
• Array.prototype.push

Answered By - SSM