Javascript Functions

Javascript Functions

In this blog, we will explore the basics of function in Javascript


4 min read

What is Function?

As we all know Javascript Statements are executed in the order that we coded and there is a scenario when we need to execute a particular block of code whenever it is needed. In such a case, we will give the block of code inside curly braces which are known as Function, that is used to execute the code whenever it is needed(i.e., by calling the function).

Let us take an example,

function add() {
 let X= a + b;
 } //Function Definition
add(); //Function Call

In the above example,

function - It is a keyword to declare the function.

Function identifier - add() is a function name to identify the function uniquely and the rules to declare the function identifier is the same as the declaration of the variable name.

What is the function definition?

The code which is needed to be executed at a certain time is given inside a block and it is known as a function definition(i.e., defining the function).

What is a function call?

  • The function call statement is used to invoke the function definition and execute the block of code.
  • Now, we will see how the function is invoked?
  • The function is invoked by its function name(i.e., the function name is declared in the function definition). Note:- the function definition block is executed only when it is called using a function call statement.

What are the Parameters?

  • Parameters are the variables passed inside the parenthesis in the function definition statement. Whose values are further used inside the function definition block(i.e., Within the block of code)
  • Multiple parameters can be given inside the parenthesis separated by a comma.
    function add(parameter_1, parameter_2){
    //Block of code
    } //Function Definition

    What are the Arguments?

  • Arguments are the values passed inside the parenthesis in the function call statement.
  • Arguments are the values, it is received by the function(i.e., function definition) when it is invoked(i.e., called).
    add(Argument_1, Argument_2); //Function call
    Note:- Arguments and parameters inside the function are local variables (i.e., they can be accessed only within the function and not outside the function.

Let us understand with an example to add and print two numbers.

function add( A,B ){
let X = A +B;
console.log(X); //11
} // Function Definition
add( 5,6 ); //Function Call

In the above example, the Task to perform is to add and print two numbers. Here function name is add.

Steps to how the function is executed:-

Step - 1: To execute the function(i.e., function definition), it should be invoked by calling its function name.

Step - 2: Arguments(i.e., values) will be received by the function parameters and then they will be passed inside the function definition block and perform the task.

What is a return statement in function?

  • When the function reaches a return statement, it stops the execution.
  • It will return back the value to the function call(i.e., where the function is invoked).
  • Then, the statement next to that function call will be executed.

Let us see an example,

function add(a,b){
return a + b;
let x = add(5,4);
console.log(x); //9

In the above example, we are performing the addition of two numbers, as we have seen before the function will be invoked and started to execute. Once the function execution reaches a return statement. It will stop the execution and return back its value to the function call statement and then it will execute the statement next to the function call statement. Here we are storing the return value in the variable x and then it is printed in the browser console.

Why function is needed?

  • Reuse of code - We can write a code once and it can be reused wherever it is needed by calling that function.
  • We can give different arguments(i.e., values ) when calling the function multiple times. because, only the logic(i.e., block of code is needed to be the same) and its arguments can be changed while calling them in multiple places.

In the next blog, we will explore Callback and arrow functions in Javascript.