Removing an element from the start of the array in javascript

Javascript Web Development Front End Technology

In this article, we are going to discuss removing an element from the start of the array in JavaScript.

For that, we are going to use the _.rest() method. This method returns the array elements except for the 0th indexed element. We can also use the shift() method and the slice() method to remove the first element from an array. Let us see the implementation of it further.

Using _.rest() Method

The following example demonstrates how to remove the start element from an array in JavaScript.

Syntax

The syntax of the _.rest() method is −

_.rest( array, index );

Example

In this example, we are going to discuss the use of the _.rest() method. We will use the _.rest() method to remove the first element form an array, so that it will exclude the 0^th element of an array.

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
      <title>Remove 0th indexed element from an array</title>
      <div id="original"></div>
      <div id="rest"></div>
   </head>
   <body>
      <script>
         let arr = [10, "Alice", 20, "Edward", 30, 40];
         document.getElementById("original").innerHTML ="The array elements are : " + arr;
         document.getElementById("rest").innerHTML ="The array elements after using the _.rest() method : " + _.rest(arr);
      </script>
   </body>
</html>

Using shift() Method

Example

In this example, we are going to discuss the use of the shift() method. We will use the shift() method to skip the first element from an array, so that it will exclude the 0th element of an array.

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
      <title>Remove 0th indexed element from an array</title>
      <div id="original"></div>
      <div id="shift"></div>
   </head>
   <body>
      <script>
         let arr = [10, "Alice", 20, "Edward", 30, 40];
         document.getElementById("original").innerHTML ="The array elements are : " + arr;
         arr.shift();
         document.getElementById("shift").innerHTML ="The array elements after using the shift() method : " + arr;
      </script>
   </body>
</html>

Using shift() Method

Example

Another example to remove an element from the start of the array using the shift() method −

let veggies = ["Onion", "Raddish"];
veggies.shift();
console.log(veggies);

Using slice() Method

Example

In this example, we are going to discuss the use of the slice() method. In this case, we will use the slice() method to skip the first element from an array, so that it will exclude the 0th element of an array.

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="UTF-8" />
      <meta http-equiv="X-UA-Compatible" content="IE=edge" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
      <title>Remove 0th indexed element from an array</title>
      <div id="original"></div>
      <div id="slice"></div>
   </head>
   <body>
      <script>
         let arr = [10, "Alice", 20, "Edward", 30, 40];
         document.getElementById("original").innerHTML =
         "The array elements are : " + arr;
         let sliceArr = arr.slice(1, arr.length);
         document.getElementById("slice").innerHTML =
         "The array elements after using the slice() method : " + sliceArr;
       </script>
  </body>
</html>