How to Divide an Array in Equal Parts in JavaScript

In this tutorial, we’ll learn how to divide an Array in equal parts using Array.splice() method in JavaScript. We will also learn how it is different from Array.slice() method.

Divide array in two equal parts

We can divide an array in half in two steps:

1. Find the middle index of the array using length/2 and Math.ceil() method,
2. Get two equal parts of the array using this middle index and Array.splice() method

const list = [1, 2, 3, 4, 5, 6];
const middleIndex = Math.ceil(list.length / 2);

const firstHalf = list.splice(0, middleIndex);   
const secondHalf = list.splice(-middleIndex);

console.log(firstHalf);  // [1, 2, 3]
console.log(secondHalf); // [4, 5, 6]
console.log(list);       // []

Array.splice() method changes the content of an array by removing, replacing or adding elements. Do not confuse this method with Array.slice() method which is used to make a copy of an array.

• list.splice(0, middleIndex) removes first 3 elements starting from 0 index from an array and returns it.
• list.splice(-middleIndex) removes last 3 elements from an array and returns it.

At the end of these two operations, since we have removed all the elements from the array, the original array is empty.

Also note that number of elements are even in the above case, in case of odd number of elements, first half will have one extra element.

const list = [1, 2, 3, 4, 5];
const middleIndex = Math.ceil(list.length / 2);

list.splice(0, middleIndex); // returns [1, 2, 3]
list.splice(-middleIndex);   // returns [4, 5]

Array.slice and Array.splice

Sometime you wish not to alter the original array, this can also be done by chaining Array.slice() method with Array.splice()

const list = [1, 2, 3, 4, 5, 6];
const middleIndex = Math.ceil(list.length / 2);

const firstHalf = list.slice().splice(0, middleIndex);   
const secondHalf = list.slice().splice(-middleIndex);

console.log(firstHalf);  // [1, 2, 3]
console.log(secondHalf); // [4, 5, 6]
console.log(list);       // [1, 2, 3, 4, 5, 6];

We see that our original array remains the same since we make a copy of original array using Array.slice() before removing the elements using Array.splice().

Divide array in three equal parts

Let’s define an array and divide them in three equal parts using the Array.splice method.

const list = [1, 2, 3, 4, 5, 6, 7, 8, 9];
const threePartIndex = Math.ceil(list.length / 3);

const thirdPart = list.splice(-threePartIndex);
const secondPart = list.splice(-threePartIndex);
const firstPart = list;     

console.log(firstPart);  // [1, 2, 3]
console.log(secondPart); // [4, 5, 6]
console.log(thirdPart);  // [7, 8, 9]

Let’s break down how it happened:

1. We have first extracted the thirdPart using list.splice(-threePartIndex), which removes last 3 elements [7, 8, 9], at this point list contain only first 6 elements [1, 2, 3, 4, 5, 6].
2. Now we have extracted the secondPart using list.splice(-threePartIndex), which removes last 3 elements from remaining list = [1, 2, 3, 4, 5, 6] which is [4, 5, 6], at this point list contain only first 3 elements [1, 2, 3] which is firstPart.

More about Array.splice

Let’s look at more examples using Array.splice() method. Take note that Array.slice() has been used before Array.splice() because we do not want to alter the original array. You can omit the use of Array.slice() if you want to alter the original array in below examples.

// Define an array
const list = [1, 2, 3, 4, 5, 6, 7, 8, 9];

1. Get first element of an array

   list.slice().splice(0, 1); // [1]
   

2. Get first five elements of an array

   list.slice().splice(0, 5); // [1, 2, 3, 4, 5]
   

3. Get all elements after first five element of an array

   list.slice().splice(5);   // [6, 7, 8, 9]
   

4. Get last element of an array

   list.slice().splice(-1);   // [9]
   

5. Get last three elements of an array

   list.slice().splice(-3);   // [7, 8, 9]