JavaScript Basic Array Methods

It’s recommended to go through Arrays in JavaScript . We would be discussing the following array function:

  1. Array.push() : Adding Element at the end of an Array. As array in JavaScript are mutable object, we can easily add or remove elements from the Array. And it dynamically changes as we modify the elements from the array.
    Syntax :

    Array.push(item1, item2 …)
    Parameters: Items to be added to an array.
    

    Description: This method is used add elements at the end of an array.

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    // Adding elements at the end of an array
    // Declaring and initializing arrays
    var number_arr = [ 10, 20, 30, 40, 50 ];
    var string_arr = [ "piyush", "gourav", "smruti", "ritu" ];
      
    // push()
    // number_arr contains [10, 20, 30, 40, 50, 60]
    number_arr.push(60);
      
    // We can pass multiple parameters to the push()
    // number_arr contains
    // [10, 20, 30, 40, 50, 60, 70, 80, 90]
    number_arr.push(70, 80, 90);
      
    // string_arr contains
    // ["piyush", "gourav", "smruti", "ritu", "sumit", "amit"];
    string_arr.push("sumit", "amit");
      
    // Printing both the array after performing push operation
    console.log("After push op " + number_arr);
    console.log("After push op " + string_arr);

    chevron_right

    
    

  2. Array.unshift() : Adding elements at the front of an Array
    Syntax :

    Array.unshift(item1, item2 …)
    Parameters: Items to be added to the array

    Description: This method is used to add elements at the beginning of an array.



    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    // Adding element at the beginning of an array
    // Declaring and initializing arrays
    var number_arr = [ 20, 30, 40 ];
    var string_arr = [ "amit", "sumit" ];
      
    // unshift()
    // number_arr contains
    // [10, 20, 20, 30, 40]
    number_arr.unshift(10, 20);
      
    // string_arr contains
    // ["sunil", "anil", "amit", "sumit"]
    string_arr.unshift("sunil", "anil");
      
    // Printing both the array after performing unshift operation
    console.log("After unshift op " + number_arr);
    console.log("After unshift op " + string_arr);

    chevron_right

    
    

  3. Array.pop() : Removing elements from the end of an array
    Syntax:

    Array.pop()
    Parameters: It takes no parameter
    

    Description: It is used to remove array elements from the end of an array.

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    // Removing elements from the end of an array
    // Declaring and initializing arrays
    var number_arr = [ 20, 30, 40, 50 ];
    var string_arr = [ "amit", "sumit", "anil" ];
      
    // pop()
    // number_arr contains
    // [ 20, 30, 40 ]
    number_arr.pop();
      
    // string_arr contains
    // ["amit", "sumit"]
    string_arr.pop();
      
    // Printing both the array after performing pop operation
    console.log("After pop op " + number_arr);
    console.log("After popo op " + string_arr);

    chevron_right

    
    

  4. Array.shift() : Removing elements at the beginning of an array
    Syntax :

    Array.shift()
    Parameter : it takes no parameter
    

    Description : It is used to remove array at the beginning of an array.

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    // Removing element from the beginning of an array
    // Declaring and initializing arrays
    var number_arr = [ 20, 30, 40, 50, 60 ];
    var string_arr = [ "amit", "sumit", "anil", "prateek" ];
      
    // shift()
    // number_arr contains
    //  [30, 40, 50, 60];
    number_arr.shift();
      
    // string_arr contains
    // ["sumit", "anil", "prateek"]
    string_arr.shift();
      
    // Printing both the array after performing shifts operation
    console.log("After shift op " + number_arr);
    console.log("After shift op " + string_arr);

    chevron_right

    
    

  5. Array.splice() : Insertion and Removal in between an Array
    Syntax:

    Array.splice (start, deleteCount, item 1, item 2….) 
    Parameters:  
    Start : Location at which to perform operation
    deleteCount: Number of element to be deleted, 
    if no element is to be deleted pass 0.
    Item1, item2 …..- this is an optional parameter . 
    These are the elements to be inserted from location start 

    Description: Splice is very useful method as it can remove and add elements from the particular location.

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    // Removing an adding element at a particular location
    // in an array
    // Declaring and initializing arrays
    var number_arr = [ 20, 30, 40, 50, 60 ];
    var string_arr = [ "amit", "sumit", "anil", "prateek" ];
      
    // splice()
    // deletes 3 elements starting from 1
    // number array contains [20, 60]
    number_arr.splice(1, 3);
      
    // doesn't delete but inserts 3, 4, 5
    // at starting location 1
    number_arr.splice(1, 0, 3, 4, 5);
      
    // deletes two elements starting from index 1
    // and add three elements.
    // It contains  ["amit", "xyz", "geek 1", "geek 2", "prateek"];
    string_arr.splice(1, 2, "xyz", "geek 1", "geek 2");
      
    // Printing both the array after performing splice operation
    console.log("After splice op " + number_arr);
    console.log("After splice op " + string_arr);

    chevron_right

    
    

JavaScript provides various functions on array refer to the link below:

Note :All the above examples can be tested by typing them within the script tag of HTML or directly into the browser’s console.

This article is contributed by Sumit Ghosh. 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 write comments if you find anything incorrect, or you want to share more information about the topic discussed above.



My Personal Notes arrow_drop_up

Improved By : sarmisthadutta



Article Tags :

Be the First to upvote.


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.