Greetings All,

Without functions, can we imagine any programming language? Answer is obliviously a big No. Functions have made things easier and they are also the part of machine language but with different name called Subroutine.

Welcome back again, This blog is in the continuation of my series of blogs “JavaScript Behavior Under the Hood“. Today we are going to discuss about function with small ‘f’ vs Function with capital ‘F‘. Its really very interesting and after completion, you will look to all functions with different eye so keep reading.  🙂 🙂

As usual, we will go with prerequisites first:

Prerequisites: Don’t worry, you do not need to know much more things but the basic working of function like: calling, defining of function will be fine.

Let’s start:

We all know the 2 basic way of declaring our JavaScript functions i.e. function expression and function declaration. Please have look on following code:

We all are well aware with above codes so I am going further without explaining them.

function with small ‘f’ : Just a keyword used to create a function. This makes creation of function much simpler and easy to understand in JavaScript. The most important thing is: it internally calls Function() constructor. That’s why “In JavaScript, functions are first-class objects, because they can have properties and methods just like any other object”. Now you are in position to say that JavaScript function are the objects of type Function with capital ‘F’.

Function with capital ‘F’ : Function() constructor create a new function object. In JavaScript every function is actually a Function object. It has not finished here, Function() constructor gives us ability to create JavaScript function with completely different way. You will be little surprised to know that we can also create a function in JavaScript without using function with small ‘f’ keyword.

Awesome, Let’s see how?

In above code, we are not using function keyword any where to create our add() function but still we have created it and using as a function. This function creation is through Function() constructor. Let’s try to understand that how it has created a new function and what are the arguments need to pass. Read the following points:

  1. Function() constructor can takes n number of arguments when we are going to create a new function object. The assigned variable will be the name of function like add() in our above code.
  2. First n-1 arguments will be the list of arguments for our newly created function and last argument will be treated as the body of our newly created function.
  3. Make sure, all the argument in Function() constructor will be in string only even last argument for body definition as well.

These are 3 major points which we need to keep in our mind if we want to create a function by using Function() constructor.

Note 1: All the property of functions that we able to access by default like: caller, caller, name, bind etc. all are the defined in Function.prototype constructor.

Note 2: Another point need to be noted down here i.e. functions created with the Function constructor will only be able to access their own local variables and global ones.

Let’s under stand by example:

In last line of our code prop1() method returns “Hi” not “Hello”. This is exactly same what I have discussed in note 2. Function() constructor have only access the global object and the local variable defined in body itself. This line give us very crucial a point i.e. Note 3.

Note 3: Function() constructor can not be used as the closure property of the function. That’s the only difference between other functions creation and Function() constructor creation.

Thanking you all,

Please give your feedback by playing with the keyboard in comment box.

Hope to see you again, until then Happy Learning 🙂 🙂 …………………………