Arrays are used to store multiple items in a single object.
You can empty an array in JavaScript using arr = []; declaration.
In this tutorial, you’ll learn about the different methods to empty an array in Javascript.
If You’re in Hurry…
You can use the following code snippet to empty an array in javascript.
var birds = ["dove", "parrot", "finch", "owl", "cuckoos"];
birds = [];
console.log(birds);Output
[]If You Want to Understand Details, Read on…
Let us learn how to empty an array in JavaScript using different methods and when it is appropriate to use them.
Using Empty Array []
Using Empty Array is the simplest and fastest way to empty an array in Javascript.
You can use this method if you don’t have any references in other places to the original array. If any reference is made to the array, then the reference array stays uncleared while using this method.
Code
var birds = ["dove", "parrot", "finch", "owl", "cuckoos"];
birds = []; //No references used
console.log(birds); Output
[]Let us see another example, emptying an array referenced to another array.
Code
var birds = ["dove", "parrot", "finch", "owl", "cuckoos"];
var copyBirds = birds ; //creating an reference array.
birds =[]; // empty parent array
console.log(birds);
console.log(copyBirds); Output
[]
["dove", "parrot", "finch", "owl", "cuckoos"] //reference array stays unclearedReferencing the original array in other places can lead to problems, and that must be handled carefully.
Using Array Length Property
The Length property in the array returns the count of elements present in an array.
If you assign the length property of an array to 0, it will automatically delete all the elements in the array.
You can use this method when you simply want to delete the elements of the array without processing any of them.
Code
var birds = ["dove", "parrot", "finch", "owl", "cuckoos"];
birds.length = 0;
console.log(birds);Output
[]Using Array Splice()
The Array.splice() method changes the array by removing or replacing the existing items.
To empty an array using the array.splice(), you need to pass 0 as the start index and the array.length as the end index.
You can use this method when you want to remove a range of items in a loop to process it and finally empty the array.
Code
var birds = ["dove", "parrot", "finch", "owl", "cuckoos"];
birds.splice(0, birds.length);
console.log(birds);Output
[]Using Array Pop()
The Array.pop() is used to remove the last item of an array and returns it.
To empty an array using the array.pop(), you have to iterate every element of the array and pop it out(remove the last item of that array).
It is not an optimal choice to empty an array using the array.pop() because of its performance;
You can use this method when you want to empty the array by popping out each last element one by one and process it.
Code
var birds = ["dove", "parrot", "finch", "owl", "cuckoos"];
while (birds.length > 0) {
birds.pop();
}
console.log(birds);Output
[]Using Array Shift()
The Array.shift() is used to remove the first item of an array and return it.
To empty an array using array.shift(), you have to iterate through the array and shift it.
This is not an optimal way to empty an array.
You can use this method when you want to empty the array by popping out each first element one by one and process it.
Code
var birds = ["dove", "parrot", "finch", "owl", "cuckoos"];
while (birds.length > 0) {
birds.Shift();
}
console.log(birds);Output
[]JSfiddle
This tutorial is available in this JSFiddle.
