The array is a type of data structure that allows us to store similar types of data under a single variable. The array is helpful to create a list of elements of similar types, which can be accessed using their index.
In this article, we will discuss different ways to remove elements from the array. There are many methods that are used to remove elements from the JavaScript array which are discussed below.
We can delete an element or item from an array using two functions which is:
- JavaScript Array shift() Method
- JavaScript Array pop() Method
- Using JavaScript splice() Method
- Using JavaScript Array filter() Method
Remove Array elements by using Array shift() Method
This method is used to delete one or more elements from the array and these elements get deleted from the beginning of the array because of the deleted elements or items from the array, the length of the array also gets decreased by the number of elements deleted from the array.
Below are examples of how to do this: Let’s see how to delete an element at the beginning of the array using the shift() function.
Input: arr[] = {3, 1, 2, 5, 90}, size = 5, capacity = 5
Output: arr[] = {_, 1, 2, 5, 90}, size = 4, capacity = 5
Example 1: In this example, we use an array to delete elements at the beginning of an array using the shift() function.
Javascript
const arr = [3, 1, 2, 5, 90];arr.shift();console.log(arr); |
[ 1, 2, 5, 90 ]
Example 2: In this example, we use an associative array to delete elements at the beginning of an array using the JavaScript array shift() function.
Javascript
let arr = [ { key: 'first', val: '3' }, { key: 'second', val: '1' }, { key: 'third', val: '2' }, { key: 'fourth', val: '5' }, { key: 'fifth', val: '90' }];arr.shift();console.log(arr); |
[
{ key: 'second', val: '1' },
{ key: 'third', val: '2' },
{ key: 'fourth', val: '5' },
{ key: 'fifth', val: '90' }
]
Remove elements by using the JavaScript array pop() Method
This method is used to pop or delete elements or items from an array. We can pop one or more elements from the array and these elements get deleted from the end of the array because of the popped elements from the array, the length of the array also gets decreased by the number of elements popped from the array.
Below are examples of how to do it: Let’s see how to delete an element at the end of the array using the pop() function.
Input: arr[] = {3, 1, 2, 5, 90}, size = 5, capacity = 5
Output: arr[] = {3, 1, 2, 5, _}, size = 4, capacity = 5
Example 1: In this example, we use an array to delete elements at the end of an array using the JavaScript array pop() function.
Javascript
let arr = [3, 1, 2, 5, 90];console.log("Orginal array: " + arr);console.log("Extracted element: " + arr.pop());console.log("Remaining elements: " + arr); |
Orginal array: 3,1,2,5,90 Extracted element: 90 Remaining elements: 3,1,2,5
Example 2: In this example, we use an associative array to delete elements at the end of an array using the pop() function.
Javascript
let arr = [ { key: 'first', val: 3 }, { key: 'second', val: 1 }, { key: 'third', val: 2 }, { key: 'fourth', val: 5 }, { key: 'fifth', val: 90 }];let val = arr.pop();console.log('key popped: ' + val.key);console.log('value popped: ' + val.val); |
key popped: fifth value popped: 90
Delete an Element from Array using JavaScript splice() Method
The JavaScript Array splice() Method is an inbuilt method in JavaScript that is used to modify the contents of an array by removing the existing elements and/or by adding new elements.
Example:
Javascript
function func() { let array = ["HTML", "CSS", "JS", "Bootstrap"]; console.log("Original array: " + array); // Add 'React' and 'Php' after removing 'JS'. let removedElement = array.splice(1, 1, 'PHP', 'React') console.log("Array after splice: " + array); console.log("Removed element: " + removedElement); }func(); |
Original array: HTML,CSS,JS,Bootstrap Array after splice: HTML,PHP,React,JS,Bootstrap Removed element: CSS
Delete an Array Element using JavaScript Array filter() Method
The JavaScript Array filter() 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 method.
Example:
Javascript
// Declare and initialize an arraylet array = ["algo", "maths", "science", "biology"] // Using filter method to create a remove methodfunction arrayRemove(arr, value) { return arr.filter(function (neveropen) { return neveropen != value; }); } let result = arrayRemove(array, "algo");console.log("Remaining elements: " + result) |
Remaining elements: maths,science,biology
