How to Empty an Array in JavaScript?

How do you empty an array in JavaScript? In this article we will look at a few options that we can use and help you decide which one may be the best for you.

Shortening the Length of Array to Zero

Since Array.length is a read/write property, you can simply discard all elements of an array by shortening its length to 0. For example:

const a = [1, 2, 3, 4, 5];
a.length = 0; // output: []

All browsers support this behavior, and the removed values get garbage collected. It also works when using strict mode (i.e. declaring "use strict" before any other statements) because the length property of an array is read/write.

const a = [1, 2, 3, 4, 5];
const b = a;

a.length = 0;

console.log(b); // output: []

const a = [1, 2, 3, 4, 5];
const b = a;

b.length = 0;

console.log(a); // output: []

Is Emptying an Array Using array.length an Anti-pattern?

This is a much-debated topic, and the short answer is; it is alright to use it this way! Especially because the length property is writable as per the official specification, and is in fact an intended way to shorten or widen an array. The main concern with this method that people argue about most is that it's not very readable (i.e. looking at the code it's not immediately clear that your intention is to truncate the array). However, the length property is widely understood and this should not be an issue.

Using Array.splice() to Remove All Elements of Array

The array splice() method is actually intended to add, remove or replace the contents of an array. In our case, we could do the following to remove all the elements of an array:

const a = [1, 2, 3, 4, 5];

// method 1
a.splice(0);

// method 2
a.splice(0, a.length);

This way of truncating an array is equivalent to setting the length property of the array to 0 (as discussed earlier).

const a = [1, 2, 3, 4, 5];
const b = a;

a.splice(0);

console.log(b); // output: []

const a = [1, 2, 3, 4, 5];
const b = a;

b.splice(0);

console.log(a); // output: []

Assigning the Variable to a New Empty Array

let a = [1, 2, 3, 4, 5];
a = []; // output: []

You can't use this method with variables declared as const since the value of a constant cannot be changed through reassignment.

let a = [1, 2, 3, 4, 5];
let b = a;

a = [];

console.log(b); // output: [1, 2, 3, 4, 5];

Despite the issues mentioned above, this method may be useful (and even fast) when you want to quickly clear really large arrays. Make sure that you have no references to it though, otherwise the garbage collection won't actually remove the elements of the array from memory as it would still have a reference.

Using a Loop to Clear the Array

By using the shift() or pop() methods inside a loop, we can reduce the array element-by-element till it's empty. For example:

const a = [1, 2, 3, 4, 5];

// method 1: using shift()
while (a.length) {
    a.shift();
}

// method 2: using pop()
while (a.length) {
    a.pop();
}

console.log(a); // output: []

To some it might seem like a good idea to shorten the syntax of the code by putting pop or shift methods directly inside the conditional part of the loop (for example: while(array.pop()); or while(array.shift());), but it's best to avoid this! It can have potential side-effects when trying to empty an array in cases where an item in the array is a falsy value.

This method linearly clears the elements of the array and can be very slow for large arrays. One way we could optimize it a bit would be to use pop and shift methods together inside the body of the loop. This would reduce the number of iterations required by the loop to clear the array. For example:

while (a.length) {
    a.shift();
    a.pop();
}

Similar to using array.splice(0) or array.length = 0 to empty an array (as discussed earlier) all variables referencing to the same array will also point to the empty array in memory once the original, or any referencing variables, empty the array.