JavaScript functions , arrow functions : Hoisting and Closures

    A function is a block of code defined to perform a particular task.

There are multiple ways, using which we can define a function in JavaScript:

      Syntax:

             1. function functionName(list of parameters){
                    //statements 
               }

             2. Anonymous Function: these are the functions which don't have its own name. However, we can provide the name using an expression as:

              const name = function(list of parameters){
                //statements
              }

             3. Arrow functions:

                const functionName = (list of parameters) =>{
                       //statements
                 }

Calling a function:

          In order to use the function in our program, we need to call it using the function name by passing the parameter if required.

         Example:

                   function add(a){
                          return a+10;
                   }

                   //Calling function add
                   let val = add(5)
                   console.log(val) //output: 15

Function Parameters:

       We can also declare two types of function Parameters:

       1. Default parameter :
           The default value of function Parameters is undefined. But we can assign some default values as:

                function add(a=5){
                          return a+10;
                 }

                 Now if you don't pass the argument while calling the function, it won't throw any error or unexpected result, as it will use the default value.

Note: Make the last parameter of function as default, if you declare a default parameter before a required parameter, then you have to pass some value.

               function add(a=2, b){
                          return a+b;
               }

               add(5) //assigns 5 to a and returns NaN, because value of b is undefined
               add(5,3) //returns 8

               If you don't want to pass the value for the default parameter, and if it is declared before required parameter, then pass an undefined as

              add(undefined, 3) //return 5

       2. Rest parameter
               The rest parameter allows us to pass infinite number of arguments as an array.

            Example:

                     function add(...args){    //triple(...) dot allows us to declare a rest parameter
                          let total =0;
                         for(let num of args){
                                total +=num;
                         }
                         return total;
                   }

                   //Pass as many values as you want
                   add(1,2,3,4,5) //returns 15

                   add(2,5) //returns 7

Function Hoisting: 

          As like variable hoisting, functions which are declared as function object (not arrow function or anonymous function) will be declared in top of the current scope by JavaScript interpreter.

Hence calling a function before it's declaration will not throw any error because function is already available in the scope.

        Example:

                  //Calling function add before declaration
                   let val = add(5)
                   console.log(val) //output: 15

                   function add(a){
                          return a+10;
                   }

Note: let say you have declared an anonymous function or arrow function, in that case your function declaration would look something like this:

                   add(4); //Reference Error
                   const add = function(a){
                          return a+10;
                   }

In this case, calling function before it's declaration will throw a Reference Error.

Closures:

             In JavaScript, we can define a function inside another function called nesting of functions. In this case, the inner function will have full access of all the variables and functions of outer class. This is called closure.

Note: Outer function will not have access to the variables and functions defined inside inner function.

Example:

         function operation(a){
                let val = a+2;
                function addSquare(b){
                        return a+b*b;
                }
                return addSquare;
          }

          let insideFunction = operation(2)
          console.log(insideFunction(3)) //output:11

          //Since inner function forms a closure so you can call it as
         operation(2)(3) //output: 11

Note: A closure preserves the arguments and variables in all scopes. In the above example argument 2 is preserved until we call insideFunction(3).

Continue Learning: Destructuring Assignment