JavaScript array is a single variable that is used to store the elements or a group of values. You can add or remove elements from the array in any position. In this article, we will discuss different ways to remove elements from the array.
Methods to Remove Elements from JavaScript Array:
There are many methods that are used to remove elements from JavaScript array which are discussed below:
- using JavaScript pop() method
- using JavaScript shift() method
- using JavaScript splice() method
- using JavaScript filter() method
- using Remove Method
- using JavaScript Delete Operator
- using Clear and Reset Operator
- using for() loop and a new array
- using lodash _.remove method
Note: There are some other methods that are created by JavaScript inbuilt methods.
The below examples illustrate the methods to remove elements from a JavaScript array:
Method 1: using the pop() method:
This method is used to remove the last element of the array and returns the removed element. This function decreases the length of the array by 1.
Example 1:
javascript
// JavaScript code to illustrate pop() function // to remove array elementsfunction func() { let arr = ["shift", "splice", "filter", "pop"]; // Popping the last element from the array let popped = arr.pop(); console.log("Removed element: " + popped); console.log("Remaining elements: " + arr);}func(); |
Removed element: pop Remaining elements: shift,splice,filter
Example 2:
javascript
// Declare and initialize an arraylet array = ["pop", "splice", "filter", "shift"]console.log("Original array: " + array + "<br>")// Loop run while array length not zerowhile (array.length) { // Remove elements from array array.pop();}console.log("Array Length: " + array.length) |
Original array: pop,splice,filter,shift<br> Array Length: 0
Method 2: using the shift() method
This method is used to remove the first element of the array and reduce the size of the original array by 1.
Example:
javascript
// JavaScript code to illustrate shift() method// to remove elements from arrayfunction func() { let arr = ["shift", "splice", "filter", "pop"]; // Removing the first element from array let shifted = arr.shift(); console.log("Removed element: " + shifted); console.log("Remaining elements: " + arr);}func(); |
Removed element: shift Remaining elements: splice,filter,pop
Method 3: Using the splice() method
This method is used to modify the contents of an array by removing the existing elements and/or adding new elements. To remove elements by the splice() method you can specify the elements in different ways.
Example 1: Use the indexing of the splice method to remove elements from a JavaScript array.
javascript
// JavaScript code to illustrate splice() function function func() { let arr = ["shift", "splice", "filter", "pop"]; // Removing the specified element from the array let spliced = arr.splice(1, 1); console.log("Removed element: " + spliced); console.log("Remaining elements: " + arr);}func(); |
Removed element: splice Remaining elements: shift,filter,pop
Example 2: Using the value of the splice method to remove elements from a JavaScript array.
javascript
// JavaScript code to illustrate splice() function function func() { let arr = ["shift", "splice", "filter", "pop"]; // Removing the specified element by value from the array for (let i = 0; i < arr.length; i++) { if (arr[i] === "splice") { let spliced = arr.splice(i, 1); console.log("Removed element: " + spliced); console.log("Remaining elements: " + arr); } }}func(); |
Removed element: splice Remaining elements: shift,filter,pop
Example 3: Using the splice method to remove each element from a JavaScript array.
javascript
// Declare and initialize arraylet array = ["pop", "splice", "filter", "shift"]console.log("Original array: " + array)// Making the length of array to 0 by using splice methodarray.splice(0, array.length);console.log("Empty array: " + array) |
Original array: pop,splice,filter,shift Empty array:
Method 4: Using the filter() method
This method is used to create a new array from a given array consisting of only those elements from the given array which satisfy a condition set by the argument function. To remove elements by filter() method you can specify the elements in different ways.
Example: Use the value of the filter method to remove elements from a JavaScript array.
javascript
// JavaScript to illustrate filter() methodfunction isPositive(value) { return value > 0;}function func() { let filtered = [101, 98, 12, -1, 848].filter(isPositive); console.log("Positive elements in array: " + filtered);}func(); |
Positive elements in array: 101,98,12,848
Method 5: Using Remove Method
Creating a remove method using the filter method to remove elements from a JavaScript array. This method works in reverse order.
Example:
javascript
// Declare and initialize an arraylet array = ["lowdash", "remove", "delete", "reset"]// Using filter method to create a remove methodfunction arrayRemove(arr, value) { return arr.filter(function (neveropen) { return neveropen != value; });}let result = arrayRemove(array, "delete");console.log("Remaining elements: " + result) |
Remaining elements: lowdash,remove,reset
Method 6: Using Delete Operator
Use the delete operator to remove elements from a JavaScript array.
Example:
javascript
// Declare and initialize an arraylet array = ["lowdash", "remove", "delete", "reset"]// Delete element at index 2let deleted = delete array[2];console.log("Removed: " + deleted);console.log("Remaining elements: " + array); |
Removed: true Remaining elements: lowdash,remove,,reset
Method 7: Using Clear and Reset Operator
Use the clear and reset operator to remove elements from a JavaScript array.
Example 1:
javascript
// Declare and initialize an arraylet array = ["lowdash", "remove", "delete", "reset"]// Sorting array in another arraylet arrayneveropen = array// Delete each element of arrayarray = []console.log("Empty array: " + array)console.log("Original array: " + arrayneveropen) |
Empty array: Original array: lowdash,remove,delete,reset
Example 2:
javascript
// Declare and initialize an arraylet array = ["lodash", "remove", "delete", "reset"]console.log("Original array: " + array + "<br>")// Making the array length to 0array.length = 0;console.log("Empty array: " + array) |
Original array: lodash,remove,delete,reset<br> Empty array:
Method 8: using a simple for() loop and a new array
Here a simple for() will be run over the array and the except for the removed element, the remaining elements will be pushed into the new array which will be declared inside the function or a method.
Example:
Javascript
let removeElement = (array, n) => { let newArray = []; for (let i = 0; i < array.length; i++) { if (array[i] !== n) { newArray.push(array[i]); } } return newArray;};let passed_in_array = [1, 2, 3, 4, 5];let element_to_be_removed = 2;let result = removeElement(passed_in_array, element_to_be_removed);console.log("Remaining elements: " + result); |
Remaining elements: 1,3,4,5
Method 9: Using lodash _.remove method
Use the lodash library to remove elements from a JavaScript array. To use lodash library you need to install it locally on your system.
Example:
Javascript
// Import Lodash libraryconst _ = require('lodash');// Declare and initialize an arraylet array = [101, 98, 12, -1, 848];// using _.remove to remove odd numberlet evens= _.remove(array, function(n) { return n % 2 == 0;}); console.log("odd elements: " + array);console.log("even elements: " + evens); |
Output:
odd elements: 101, -1
even elements: 98, 12, 848
