Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to remove an item from JavaScript array by value?
In this tutorial, we will learn to remove an item from a JavaScript array by value.
An array is a data structure that can store a collection of data with the same data type. A contiguous memory location is allocated to the array elements. Each array element is identified by its index value.
You must process an array by inserting an element, removing or changing, etc. JavaScript has a lot of methods to update an array. Let us take a look at various ways to remove an item from a JavaScript array by value.
Following are the Methods/Functions to remove an item from an array by value −l
- The Array filter() Method
- The Array splice() Method
Using the Array filter() Method
A filter() is the method that creates a new array of elements that satisfies the given condition. A filter() method does not change the original array.
Users can follow the below syntax to use the filter() method to remove an item from a JavaScript array by value.
Syntax
let arr = [1,2,3,......,n];
array.filter( function(curr_element, index, arr)) => {
/* condition*/
});
In the above syntax, we have used the filter method and passed the callback function which contains the condition to filter the array.
Parameters
function − A function to execute for every array element
curr_element − Value of the current element
index − Index of the current element (optional)
arr − Array of the current element (optional)
Example
In the below-given example, we are using the filter() method to remove an item from a JavaScript array by value. We have taken two array examples and removed an item from a JavaScript array by value.
<html> <body> <h3>Use <i>filter()</i> method to remove an item from a JavaScript array by value.</h3> <p><b>Example 1: </b>Remove value 4</p> <div id="output1"></div> <p><b>Example 2:</b> remove value "E"</p> <div id="output2"></div> <script> let output1 = document.getElementById("output1"); let output2 = document.getElementById("output2"); let output = ""; let arr1 = [1, 2, 3, 4, 5]; output = "Array before filter() = " + arr1 + "<br>"; let arr1_new = arr1.filter(function(f) { return f !== 4 }); output = output + " New array after filter() = " + arr1_new; output1.innerHTML = output; let arr2 = ["A", "B", "C", "D", "E"]; output = "Array before filter() = " + arr2 + " <br>"; let arr2_new = arr2.filter(function(f) { return f !== "E" }); output = output + " New array after filter() = " + arr2_new; output2.innerHTML = output; </script> </body> </html>
In the above two arrays, users can see that the filter() method returns the new array of elements that matches the condition.
Using the Array splice() Method
The splice() method adds or removes elements from an array.
The splice() method can change the Original Array.
Viewers can follow the below syntax to use the splice() method to remove an item from a JavaScript array by value.
Syntax
let arr = [1,2,3,......,n]; arr.splice( index, count, elements)
In the above syntax, we have used the spilce() method, and users can learn about its parameters below.
Parameters
index − Index of an element to add/remove
count − Number of elements to add (optional)
elements − Name of elements to add(optional)
Example
In the below-given example, we are using the splice() method to remove an item from a JavaScript array by value. We are taking two array examples and removed an item from a JavaScript array by value.
<html> <head> </head> <body> <h3>Use <i>splice()</i> to remove an item from a JavaScript array by value.</h3> <p><b>Example 1</b></p> <div id = "output1"></div> <p><b>Example 2</b></p> <div id = "output2"></div> <script> let output1 = document.getElementById("output1"); let output2 = document.getElementById("output2"); let output=""; let arr1=[1,2,3,4,5]; let element=arr1.indexOf(2); output="Array before splice() = "+arr1+"<br>"; if (element > -1) { arr1.splice(element, 1); } output=output+"New array after splice() = "+arr1; output1.innerHTML = output; let arr2=["A","B","C","D","E"]; let element1=arr2.indexOf("B"); output="Array before splice() = "+arr2+"<br>"; if (element1 > -1) { arr2.splice(element1, 1); } output=output+"New array after splice(): "+arr2; output2.innerHTML = output; </script> </body> </html>
We have learned two methods to remove an item from a JavaScript array by value. Among these methods, the filter() method creates a new array of elements based on the condition.
The splice() is used to add or remove the elements on a specific index that changes the original array.
388 Views
