Skip to content
Related Articles

Related Articles

Improve Article

Passing a function as a parameter in JavaScript

  • Last Updated : 02 May, 2019
Geek Week

Passing a function as an argument to the function is quite similar to the passing variable as an argument to the function. Below examples describes to passing a function as a parameter to another function.

Example 1: This example passes a function geeks_inner to the function geeks_outer as an argument.




<!DOCTYPE html> 
<html
    <head
        <title
            JavaScript | Pass a function as parameter 
        </title
    </head
      
    <body style = "text-align:center;"
          
        <h1 style = "color:green;"
            GeeksForGeeks 
        </h1
          
        <p
            Passing function as arguments. 
        </p
          
        <!-- Function call after clicking the button -->
        <button onclick = "geeks_outer(geeks_inner)"
            Click Here 
        </button>     
          
        <script
            function geeks_inner(value){
                return 'hello User!';
            }
            function geeks_outer(func){
                alert(func());
            }
        </script
    </body
</html>                    

Output:

  • Before clicking on the button:
  • After clicking on the button:

Example 2: This example passes a function geeks_inner alongwith a argument ‘Geeks!’ to the function geeks_outer as a argument.




<!DOCTYPE html> 
<html
    <head
        <title
            JavaScript | Pass a function as parameter 
        </title
    </head>     
      
    <body style = "text-align:center;"
          
        <h1 style = "color:green;"
            GeeksForGeeks 
        </h1
      
        <p
            Passing function as arguments. 
        </p>             
          
        <button onclick = "geeks_outer('Geeks!', geeks_inner)"
            Click Here 
        </button>         
          
        <!-- Script to uses function call using
            function as argument -->
        <script
            function geeks_inner(value){
                return 'hello '+value;
            }
            function geeks_outer(a, func){
                alert(func(a));
        }         
        </script
    </body
</html>                    

Output:

  • Before clicking on the button:
  • After clicking on the button:

Hey geek! The constant emerging technologies in the world of web development always keeps the excitement for this subject through the roof. But before you tackle the big projects, we suggest you start by learning the basics. Kickstart your web development journey by learning JS concepts with our JavaScript Course. Now at it’s lowest price ever!




My Personal Notes arrow_drop_up
Recommended Articles
Page :