Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

How to write a function in JavaScript ?

  • Last Updated : 29 Sep, 2021

Introduction: A function is a collection of reusable code that may be invoked from anywhere in your application. This avoids the need to write the same code again and over. It aids programmers in the creation of modular code. Functions enable a programmer to break down a large program into several smaller and more manageable functions.

Functions are one of JavaScript’s core building elements. In JavaScript, a function is comparable to a procedure—a series of words that performs a task or calculates a value—but for a process to qualify as a function, it must accept some input and produce an output with a clear link between the input and the result. To utilize a function, it must be defined in some place within the scope from which it will be called.

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!

Function Definition: A function definition or function statement starts with the function keyword and continues with the following.

  • Function’s name.
  • A list of function arguments contained in parenthesis and separated by commas.
  • Statements are enclosed in curly brackets.

Syntax:



function name(arguments)
{
   javascript statements
}

Function Calling: To call a function at a later point in the script, simply type the function’s name. By default, all JavaScript functions can utilize arguments objects. Each parameter’s value is stored in an arguments object. The arguments object is similar to an array. Its values may be accessed using an index, much like an array. It does not, however, provide array methods.  

Javascript




<script type = "text/javascript">
  function welcome() {
    console.log("welcome to GfG");
  }
  
  // Function calling
  welcome();
</script>

Output:

welcome to GFG

Function Arguments: A function can contain one or more arguments that are sent by the calling code and can be utilized within the function. Because JavaScript is a dynamically typed programming language, a function argument can have any data type as a value.

Javascript




<script type = "text/javascript"
  function welcome(name) {
    console.log("Hey "+""+name+" "+"welcome to GfG");
  }
  
  // Passing arguments
  welcome("Rohan");
</script>

Output:

Hey Rohan welcome to GFG

Return Value: A return statement is an optional part of a JavaScript function. If you wish to return a value from a function, you must do this. This should be the final statement of a function.

Javascript






<script type = "text/javascript">
  function welcome() {
      
    // Return statement
    return "Welcome to GfG";
  }
  
  welcome();
</script>

Output:

Welcome to GFG

Function Expression: We may assign a function to a variable and then utilize that variable as a function in JavaScript. It is known as a function expression.

Javascript




<script type = "text/javascript">
  var welcome = function(){
    return "Welcome to GfG";
  }
  
  var gfg = welcome();
  
  console.log(gfg);
</script>

Output:

Welcome to GFG

Types of functions in JavaScript:

1. Named function: A named function is one that we write in code and then use whenever we need it by referencing its name and providing it some parameters. Named functions come in handy when we need to call a function several times to give various values to it or run it multiple times.

Javascript




<script type = "text/javascript">
  function add(a, b){
    return a+b ;
  }
  add(5, 4);
</script>

Output:

9

2. Anonymous function: We can define a function in JavaScript without giving it a name. This nameless function is referred to as the anonymous function. A variable must be assigned to an anonymous function.

Javascript






<script type = "text/javascript">
  var add = function(a, b){
    return a + b;
  }
  add(5, 4);
</script>

Output:

9

3. Nested Functions: A function in JavaScript can contain one or more inner functions. These nested functions fall within the purview of the outer function. The inner function has access to the variables and arguments of the outer function. However, variables declared within inner functions cannot be accessed by outer functions.

Javascript




<script type = "text/javascript">
  function msg(firstName) {
    function hey() {
      console.log("Hey " + firstName);
    }
  
    return hey();
  }
  
  msg("Ravi");
</script>

Output:

Hey Ravi

4. Immediately invoked function expression: The browser executes the invoked function expression as soon as it detects it. This function has the advantage of running instantly where it is situated in the code and producing direct output. That is, it is unaffected by code that occurs later in the script and can be beneficial.

Javascript




<script type = "text/javascript">
  let msg = (function() {
    return "Welcome to GfG" ;
  })();
  msg;
</script>

Output:

Welcome to GFG



My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!