How can I check if a JavaScript variable is function type?

Front End TechnologyJavascriptWeb Development

In this tutorial, we will learn different approaches to checking if a JavaScript variable is of function type or not. In JavaScript, the function contains the block of code, making the code reusability better.

There are mainly two ways to declare the functions, one is a named function, and another is an anonymous function. While declaring the anonymous function, we need to store it in some variable to access it from somewhere in our code or call that function.

Here, users can see how to declare the anonymous function and store it into the variable.

let tutorialspoint = function() { //code for the function}

As you can see in the above example, the ‘tutorialspoint’ variable contains the function and sometimes programmers need to check if it is a type of function or not.

To solve the above problem, we can use the below different methods.

  • Using the typeof operator
  • Using the instanceof operator
  • Using the object.prototype.toString method

Using the typeof operator

Using the typeof operator in JavaScript, we can determine the data type of any variable. It returns the value of the data type of its operand in the string format.

Here, we can use the string equality ‘===’ operator in JavaScript to compare the returned value with the ‘function’ string. If the returned value matches with the ‘function,’ the variable is of the function type.

Users can follow the below syntax for the typeof operator.

Syntax

typeof operand
typeof(operand)

Parameter

  • operand − It can be any object or variable for which we want to check if it is a type of function or not.

Return − the value of the data type of 'operand' in the string format.

Example 1

The below example demonstrates how to use of the typeof operator to check the variable is of the function type.

<html>
<head>
   <title>Check type of variable is of function</title>
</head>
<body>
   <h2> typeof Operator: Check if a variable is of function type. </h2>
   <div id = "result"></div>
   <script type="text/javascript">
      let a = 10;
      let b = 20;
      var tutorialsPoint = function () {
         return a + b;
      };

      // function to check type of variable is function or not
      function checkTypeOfVar() {
         if (typeof tutorialsPoint === 'function') {
            document.write("<br>The type of <i>tutorialsPoint</i> variable is function." );
         } else {
            document.write("The type of <i>tutorialsPoint</i> variable is not a function.");
         }
      }
      document.getElementById("result").innerHTML = "var tutorialsPoint = " + tutorialsPoint;

      // call the function
      checkTypeOfVar();
   </script>
</body>
</html>

In the above code, users can see that the typeof tutorialsPoint returns the ‘function,’ and control of the function goes to the ‘if’ block and gives the above output.

Using the instanceof operator

The ‘instanceof’ operator helps us to determine whether any variable is of a given type or not. It takes two operands, one variable and another data type, object, function, or any with which you want to compare the current variable type.

In our case, we will take a function as the operand as we want to check variable is of function type or not. It returns the Boolean value, and it returns true if the type of the variable match with the given type; otherwise, it returns false.

Syntax

variable instanceof datatype

In the above syntax, as a datatype we will take ‘Function’ as we need to verify whether the variable type is function or not. It returns true if the variable is of the Function type.

Example 2

In the below example, we are checking the function type of variable using the instanceof operator.

<html>
<head>
   <title>Check type of variable is of function</title>
</head>
<body>
   <h2> <i>instanceof</i> Operator: check if a variable is of function type. </h2>
   <div id = "result"></div>
   <script type="text/javascript">
      let a = 10;
      let b = 20;
      var multiply = function () {
         return a * b;
         // other code for the function
      };

      // function to check type of variable is function or not
      function checkTypeOfVar() {
         let isTypeOfFunction = multiply instanceof Function;
         if (isTypeOfFunction===true) {
            document.write("<br>The type of <i>multiply</i> variable is <b>function</b>.");
         } else {
            document.write("<br>The type of multiply variable is not a function.");
         }
      }
      document.getElementById("result").innerHTML = "var multiply = " + multiply ;

      // call the function
      checkTypeOfVar();
   </script>
</body>
</html>

In the above code, users can see that instanceof multiply Function returns the “true” and control of the function goes to the ‘if’ block and it prints the above output.

Using the object.prototype.toString method

Generally, the object.prototype.toString method is called automatically for every object when an object needs to return the string in JavaScript. Also, we can override the return value for the toString method if we don’t override the default return for the object.toString() method is ‘[Object Type]’ where type is the object type.

Here, we will check if it returns the ‘Function’ type or not.

The standard syntax to get the type of any object or variable is as follows.

Syntax

Object.prototype.toString.call(Object_Name) == '[ object Function]'

In the above syntax, we have to pass variable in the place of Object_Name to check if it is of function type or not.

Parameter

  • Object_Name − The variable to check if it’s a function type.

Example 3

In the below example, we get the type of the variable using the Object.prototype.toString method.

<html>
<head>
   <title>Check type of variable is of function</title>
</head>
<body>
   <h2><i>object.prototype.toString()</i> Methodd </h2>
   <div id = "result"></div>
   <script type="text/javascript">
      let a = 10;
      let b = 20;
      var substract = function () {
         return a - b;
         // other code for the function
      };

      // function to check type of variable is function or not
      function checkTypeOfVar() {
         // get the type of tutorialsPoint variable
         let typeOfVar = Object.prototype.toString.call( substract );

         // compare typeOfVar with the funciton type
         if (typeOfVar == '[object Function]') {
            document.write("<br>The type of <i>substract </i> variable is <b>function</b>.");
         } else {
            document.write("<br>The type of substract variable is not a function.");
         }
      }
      document.getElementById("result").innerHTML = "var substract = " + substract ;

      // call the function
      checkTypeOfVar();
   </script>
</body>
</html>

In the above code, users can see that Object.prototype.toString.call(subtract) method returns the “[object Function]”. So, it prints the above output.

Conclusion

We have seen a total of three ways to check whether the variable is an instance of the function or not in this tutorial. Users can use any of the approaches according to their comfortability. The first and second approach has straightforward syntax to find the variable type, so maybe users can go for that before using the third approach.

raja
Updated on 12-Jul-2022 13:38:18

Advertisements