Remove elements from a JavaScript Array

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 array in any position. In this article, we will discuss different ways to remove elements from array. There are many methods that is used to remove elements from JavaScript array which are discussed below:

  • pop() function: This method is use to remove elements from the end of an array.
  • shift() function: This method is use to remove elements from the start of an array.
  • splice() function: This method is use to remove elements from the specific index of an array.
  • filter() function: This method is use to remove elements in programatically way.

Note: There are some other methods that are created by JavaScript inbuilt methods.



Below examples illustrate the methods to remove elements from a JavaScript array:

Remove Array elements by using 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:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
    // JavaScript code to illustrate pop() function 
    // to remove array elements
      
    function func() { 
        var arr = ["shift", "splice", "filter", "pop"]; 
      
        // Popping the last element from the array 
        var popped = arr.pop(); 
        document.write("Removed element: " + popped + "<br>"); 
        document.write("Remaining elements: " + arr); 
    func(); 
    </script> 

    chevron_right

    
    

  • Output:
    Removed element: pop
    Remaining elements: shift, splice, filter
  • Example 2:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
    // Declare and initialize an array
    var array = ["pop", "splice", "filter", "shift"]
      
    document.write("Original array: " + array + "<br>")
      
    // Loop run while array length not zero
    while (array.length) {
      
        // Remove elements from array
        array.pop();
    }
    document.write("Array Length: " + array.length )
      
    </script>

    chevron_right

    
    

  • Output:
    Original array: pop, splice, filter, shift
    Array Length: 0

Remove Array elements by using shift() method: This method is used to remove the first element of the array and reducing the size of original array by 1.

  • Example:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
    // JavaScript code to illustrate shift() method
    // to remove elements from array
    function func() { 
        var arr = ["shift", "splice", "filter", "pop"]; 
      
        // Removing the first element from array 
        var shifted = arr.shift(); 
        document.write("Removed element: " + shifted + "<br>"); 
        document.write("Remaining elements: " + arr); 
    func(); 
    </script>                    

    chevron_right

    
    

  • Output:
    Removed element: shift
    Remaining elements: splice, filter, pop

Remove Array elements by using splice() method: This method is used to modify the contents of an array by removing the existing elements and/or by adding new elements. To remove elements by splice() method you can specify the elements in different ways.

  • Example 1: Use the indexing of splice method to remove elements from a JavaScript array.
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
    // JavaScript code to illustrate splice() function 
      
    function func() { 
        var arr = ["shift", "splice", "filter", "pop"]; 
      
        // Removing the specified element from the array 
        var spliced = arr.splice(1, 1); 
        document.write("Removed element: " + spliced + "<br>"); 
        document.write("Remaining elements: " + arr); 
    func(); 
    </script>                    

    chevron_right

    
    

  • Output:
    Removed element: splice
    Remaining elements: shift, filter, pop
  • Example 2: Using the value of splice method to remove elements from a JavaScript array.
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script>
      
    // JavaScript code to illustrate splice() function 
    function func() {
        var arr = ["shift", "splice", "filter", "pop"];
      
        // Removing the specified element by value from the array 
        for (var i = 0; i < arr.length; i++) {
            if (arr[i] === "splice") {
                var spliced = arr.splice(i, 1);
                document.write("Removed element: " + spliced + "<br>");
                document.write("Remaining elements: " + arr);
            }
        }
    }
    func(); 
    </script>                

    chevron_right

    
    

  • Output:
    Removed element: splice
    Remaining elements: shift, filter, pop
  • Example 3: Using the splice method to remove each elements from a JavaScript array.
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
    // Declare and initialize array
    var array = ["pop", "splice", "filter", "shift"]
      
    document.write("Original array: " + array + "<br>")
      
    // Making the length of array to 0 by using splice method
    array.splice(0, array.length);
    document.write("Empty array: " + array )
    </script>

    chevron_right

    
    

  • Output:
    Original array: pop, splice, filter, shift
    Empty array:

Remove Array elements by using 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 filter method to remove elements from a JavaScript array.
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
      
    // JavaScript to illustrate filter() method
    function isPositive( value ) { 
        return value > 0; 
      
    function func() { 
        var filtered = [101, 98, 12, -1, 848].filter( isPositive ); 
        document.write("Positive elements in array: " + filtered); 
    func(); 
    </script>

    chevron_right

    
    

  • Output:
    Positive elements in array: 101, 98, 12, 848

Remove Array elements by using Remove Method: Creating a remove method using filter method to remove elements from a JavaScript array. This methods works in reverse order.

  • Example:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
      
    // Declare and initialize an array
    var array = ["lowdash", "remove", "delete", "reset"]
      
    // Using filter method to create a remove method
    function arrayRemove(arr, value) {
      
       return arr.filter(function(geeks){
           return geeks != value;
       });
      
    }
      
    var result = arrayRemove(array, "delete");
    document.write("Remaining elements: " + result)
    </script> 

    chevron_right

    
    

  • Output:
    Remaining elements: lowdash, remove, reset

Remove Array elements by Delete Operator: Use the delete operator to remove elements from a JavaScript array.

  • Example:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
      
    // Declare and initialize an array
    var array = ["lowdash", "remove", "delete", "reset"]
      
    // Delete element at index 2
    var deleted = delete array[2]; 
      
    document.write("Removed: " + deleted + "<br>");
    document.write("Remaining elements: " + array);
    </script>         

    chevron_right

    
    

  • Output:
    Removed: true
    Remaining elements: lowdash, remove,,reset

Remove Array elements by Clear and Reset Operator: Use clear and reset operator to remove elements from a JavaScript array.

  • Example 1:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
      
    // Declare and initialize an array
    var array = ["lowdash", "remove", "delete", "reset"]
      
    // Sorting array in another array
    var arraygeeks = array
      
    // Delete each element of array
    array = []
    document.write("Empty array: " + array + "<br>")
    document.write("Original array: " + arraygeeks)
      
    </script>                

    chevron_right

    
    

  • Output:
    Empty array:
    Original array: lowdash, remove, delete, reset
  • Example 2:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script> 
      
    // Declare and initialize an array
    var array = ["lowdash", "remove", "delete", "reset"]
      
    document.write("Original array: " + array + "<br>")
      
    // Making the array length to 0
    array.length = 0;
    document.write("Empty array: " + array )
      
    </script>                                

    chevron_right

    
    

  • Output:
    Original array: lowdash, remove, delete, reset
    Empty array:

Remove Array elements by lowdash library: Use the lowdash library to remove elements from a JavaScript array. To use lowdash library you need to install it locally on your system.

  • Example:
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <script type="text/javascript" src=
    "//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js">
      
    // Declare and initialize an array
    var array = [101, 98, 12, -1, 848];
    var evens= _.remove(array, function(n) {
        return n % 2 == 0;
    });
      
    console.log("odd elements: " + array + "<br>");
    console.log("even elements: " + evens);
      
    </script>                    

    chevron_right

    
    

  • Output:
    odd elements: 101, -1
    even elements: 98, 12, 848


My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.