Skip to content
Related Articles
Open in App
Not now

Related Articles

Get the first and last item in an array using JavaScript

Improve Article
Save Article
  • Last Updated : 14 Dec, 2022
Improve Article
Save Article

In this article, we will learn to get the first & last element in an array in Javascript, along with understanding their implementation through the examples.

A javascript array is a variable that holds multiple values at a time. The first and last elements are accessed using an index the first value is accessed using index 0 and the last element can be accessed through the length property which has one more value than the highest array index. The array length property in JavaScript is used to set or return the number of elements in an array.

Example 1: This example illustrates to access the first and last number in the array.

Javascript




<script>
    // Array
    let s=[3, 2, 3, 4, 5];
    function Gfg() {
     
      // Storing the first item in a variable
      let f=s[0];
       
      // Storing the last item
      let l=s[s.length-1];
       
     // Printing output to screen
     console.log("First element is "+ f);
     console.log("Last element is "+ l);
    }
    Gfg(); // Calling the function
</script>

Output:

First element is 3 
Last element is 5

Example 2: This example illustrates to access the first and last word in the array.

Javascript




<script>
    // Simple array
    let s= ["Geeks", "for", "geeks", "computer", "science"];
    function Gfg() {
     
    // First item of the array
     let f=s[0];
      
    // Last item of the array
     let l=s[s.length-1];
      
    // Printing the output to screen
     console.log("First element is "+ f);
     console.log("Last element is "+ l);
     }
    Gfg(); // Calling the function
</script>

Output:

First element is Geeks
Last element is science 

Using Array.pop() and Array.shift() method: The Array.pop()  method removes the last element of the array and return it and the Array.shift() method removes the first element from the array and returns it.

Example: In this example, we will be using the array pop() and shift() methods to get the last and first element of the array.

Javascript




<script>
    // Array
    let s=[3, 2, 3, 4, 5];
    function Gfg() {
     
        // Storing the first item in a variable
        let f = s.shift(0);
     
        // Storing the last item
        let l = s.pop();
     
     
    // Printing output to screen
    console.log("first element is "+ f);
    console.log(" Last element is "+ l);
    }
     
    Gfg(); // Calling the function
</script>

Output:

first element is 3
Last element is 5

Using Array.slice() method: Array.slice() method returns the part of the array by slicing it with provided index and length. 

Example: In this example, we will be using the slice() method to get the first and the last element of the array.

Javascript




<script>
    // Array
    let s = [3, 2, 3, 4, 5];
    function Gfg() {
     
        // Storing the first item in a variable
        let f = s.slice(0, 1);
     
        // Storing the last item
        let l = s.slice(-1);
     
     
    // Printing output to screen
    console.log("first element is "+ f);
    console.log("Last element is "+ l);
    }
    Gfg(); // Calling the function
</script>

Output:

first element is 3
Last element is 5

Using Array.filter() method: Array.filter() method returns a filtered array that removes the element which returns false for the callback function. 

Example: In this example, we will be using the filter() method to get the first and the last element of the array.

Javascript




<script>
    // Array
    let s = [3, 2, 3, 4, 5];
    function Gfg() {
     
        // Storing the first item and second in a variable
        let [f, l] = s.filter((item, i)=> (i == 0) || (i == s.length -1 ));
     
     
    // Printing output to screen
    console.log("first element is "+ f);
    console.log(" Last element is "+ l);
    }
    Gfg(); // Calling the function
</script>

Output:

first element is 3
Last element is 5

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!