Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
No. of ways to empty an array in JavaScript
JavaScript provides several methods to empty an array. Each method has different use cases and behaviors, especially when multiple references to the same array exist.
Method 1: Setting to New Array
This method creates a new empty array and assigns it to the variable. However, it doesn't affect other references to the original array.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Setting to New Array</title>
</head>
<body>
<script>
let arr = [1, 2, 3, 4, 5];
let reference = arr;
console.log("Before:", arr);
console.log("Reference before:", reference);
// Empty by setting to new array
arr = [];
console.log("After:", arr);
console.log("Reference after:", reference);
</script>
</body>
</html>
Before: [1, 2, 3, 4, 5] Reference before: [1, 2, 3, 4, 5] After: [] Reference after: [1, 2, 3, 4, 5]
Method 2: Using length Property
Setting the length property to 0 removes all elements and affects all references to the array.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Using length Property</title>
</head>
<body>
<script>
let arr = [1, 2, 3, 4, 5];
let reference = arr;
console.log("Before:", arr);
console.log("Reference before:", reference);
// Empty using length property
arr.length = 0;
console.log("After:", arr);
console.log("Reference after:", reference);
</script>
</body>
</html>
Before: [1, 2, 3, 4, 5] Reference before: [1, 2, 3, 4, 5] After: [] Reference after: []
Method 3: Using pop() Method
This method removes elements one by one from the end until the array is empty.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Using pop Method</title>
</head>
<body>
<script>
let arr = [1, 2, 3, 4, 5];
console.log("Before:", arr);
// Empty using pop
while (arr.length > 0) {
arr.pop();
}
console.log("After:", arr);
</script>
</body>
</html>
Before: [1, 2, 3, 4, 5] After: []
Method 4: Using splice() Method
The splice method removes all elements starting from index 0.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Using splice Method</title>
</head>
<body>
<script>
let arr = [1, 2, 3, 4, 5];
console.log("Before:", arr);
// Empty using splice
arr.splice(0, arr.length);
console.log("After:", arr);
</script>
</body>
</html>
Before: [1, 2, 3, 4, 5] After: []
Comparison
| Method | Affects References? | Performance | Best Use Case |
|---|---|---|---|
| New Array (arr = []) | No | Fastest | When no other references exist |
| Length Property (arr.length = 0) | Yes | Fast | When multiple references exist |
| pop() Loop | Yes | Slowest | When you need to process elements |
| splice(0, length) | Yes | Moderate | When you need removed elements |
Conclusion
Use arr.length = 0 for the most reliable approach that affects all references. Choose arr = [] only when no other variables reference the array, as it's the fastest method.
Updated on: 2026-03-15T23:18:59+05:30
254 Views
Advertisements