How to pass an array as a function parameter in JavaScript ?

Method 1: Using the apply() method: The apply() method is used to call a function with the given arguments as an array or array-like object. It contains two parameters. The this value provides a call to the function and the arguments array contains the array of arguments to be passed.

The apply() method is used on the function that has to be passed as the arguments array. The first parameter is specified as ‘null’ and the second parameter is specified with the arguments array. This will call the function with the specified arguments array.

Syntax:



filter_none

edit
close

play_arrow

link
brightness_4
code

arrayToPass = [1, "Two", 3];
  
unmodifiableFunction.apply(null, arrayToPass);

chevron_right


Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to pass an array as a function
        parameter in JavaScript ?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        JavaScript | Passing an array
        as a function parameter.
    </b>
      
    <p>
        The arguments passed
        are '1, "Two", 3'
    </p>
      
    <button onclick="passToFunction()">
        Pass to function
    </button>
      
    <script type="text/javascript">
          
        function passToFunction() {
            arrayToPass = [1, "Two", 3];
          
            unmodifiableFunction.apply(null, arrayToPass);
        }
      
        function unmodifiableFunction(a, b, c) {
            console.log("First value is: ", a);
            console.log("Second value is: ", b);
            console.log("Third value is: ", c);
        }
    </script>
</body>
  
</html>

chevron_right


Output:

  • Before clicking the button:
    apply-before
  • After clicking the button:
    apply-after

Method 2: Using the spread syntax: The spread syntax is used in place where zero or more arguments are expected. It can be used with iterators that expands in place where there may not be a fixed number of expected arguments (like function parameters).

The required function is called as given the arguments array using the spread syntax so that it would fill in the arguments of the function from the array.

Syntax:

filter_none

edit
close

play_arrow

link
brightness_4
code

arrayToPass = [1, "Two", 3];
  
unmodifiableFunction(...arrayToPass);

chevron_right


Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to pass an array as a function
        parameter in JavaScript ?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        JavaScript | Passing an array
        as a function parameter.
    </b>
      
    <p>
        The arguments passed
        are '1, "Two", 3'
    </p>
      
    <button onclick="passToFunction()">
        Pass to function
    </button>
      
    <script type="text/javascript">
      
        function passToFunction() {
            arrayToPass = [1, "Two", 3];
          
            unmodifiableFunction(...arrayToPass);
        }
      
        function unmodifiableFunction(a, b, c) {
            console.log("First value is: ", a);
            console.log("Second value is: ", b);
            console.log("Third value is: ", c);
        }
    </script>
</body>
  
</html>

chevron_right


Output:

  • Before clicking the button:
    spread-before
  • After clicking the button:
    spread-after

full-stack-img




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.