JavaScript Function() Constructor

The JavaScript Function() constructor is used to create new function objects dynamically. By using the Function() constructor with the new operator, developers can define functions on the fly, passing the function body as a string. This allows for greater flexibility in situations where functions need to be created based on runtime conditions or user input.

One notable characteristic of functions created with the Function() constructor is that they have a global scope, meaning they are accessible from anywhere in the code.

Syntax:

var variable = new Function(arg1, arg2..., Function Body)

Parameters:

  • arg*: It is an optional parameter. A function can contain any number of string arguments.
  • Function Body: It is an argument that contains the Javascript statements containing the function definition.

Below are some examples that show the use of the Javascript function constructor.

Example 1: In this example, we will see the basic use of the Javascript function constructor.

HTML
<!DOCTYPE HTML>
<html>
<head>
    <script type="text/javascript">
        <!--
        var func = new Function("x", "y", "return x*y;");
        function Beginner() {
           var result;
           result = func(10,20);
           document.write ( result );
        }
    </script>
</head>

<body>
    <h1 style="color:green">
        Beginner For Beginner
    </h1>
    <h3>Javascript function constructor</h3>
    <p>Click the following button to see the result</p>

    <input type="button" onclick="Beginner()"value="Click Me">

</body>
</html>

Output:

Javascript function constructor

Example 2: In this example, we will create a Javascript constructor and print the values of the function.

HTML
<!DOCTYPE HTML>
<html>
<head>
    <script type="text/javascript">
        <!--
        var func = new Function("firstName", "lastName", 
                                "return firstName + ' ' + lastName + ' ' + firstName;");
        function Beginner() {
           var result;
           result = func("Beginner","for");
           document.write ( result );
        }
    </script>
</head>

<body>
    <h1 style="color:green">
        Beginner For Beginner
    </h1>
    <h3>Javascript function constructor</h3>
    <p>Click the following button to see the result</p>

    <input type="button" onclick="Beginner()"value="Click Me">

</body>
</html>

Output:

Javascript function constructor

Conclusion

The JavaScript Function() constructor provides a dynamic way to create functions, offering flexibility in scenarios where functions must be generated at runtime. While powerful, it should be used with caution to avoid security and performance issues. Understanding how and when to use the Function() constructor can enhance your JavaScript programming skills, allowing you to create more adaptable and responsive applications. By leveraging this feature effectively, developers can write more dynamic code, making their applications more robust and versatile.

We have a complete list of Javascript Functions, to check those please go through this Javascript Function Complete reference article.