Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
How to define a JavaScript function using Function() Constructor?
The Function() constructor expects any number of string arguments. The last argument is the body of the function - it can contain arbitrary JavaScript statements, separated from each other by semicolons.
Syntax
new Function([arg1[, arg2[, ...argN]],] functionBody)
Parameters
arg1, arg2, ...argN: Names to be used by the function as formal argument names (optional).
functionBody: A string containing the JavaScript statements comprising the function definition.
Example: Basic Function Creation
<html>
<head>
<script>
var func = new Function("x", "y", "return x * y;");
function multiplyFunction() {
var result = func(15, 35);
document.write("Result: " + result);
}
</script>
</head>
<body>
<p>Click the following button to call the function</p>
<form>
<input type="button" onclick="multiplyFunction()" value="Call Function">
</form>
</body>
</html>
Result: 525
Example: Function with No Parameters
<html>
<head>
<script>
var greet = new Function("return 'Hello, World!';");
function showGreeting() {
document.write(greet());
}
</script>
</head>
<body>
<button onclick="showGreeting()">Show Greeting</button>
</body>
</html>
Hello, World!
Example: Function with Multiple Statements
<html>
<head>
<script>
var calculator = new Function("a", "b", "operation",
"var result; " +
"if (operation === 'add') result = a + b; " +
"else if (operation === 'subtract') result = a - b; " +
"else if (operation === 'multiply') result = a * b; " +
"else if (operation === 'divide') result = a / b; " +
"return result;"
);
function calculate() {
var sum = calculator(10, 5, 'add');
var product = calculator(10, 5, 'multiply');
document.write("Sum: " + sum + "<br>");
document.write("Product: " + product);
}
</script>
</head>
<body>
<button onclick="calculate()">Calculate</button>
</body>
</html>
Sum: 15 Product: 50
Key Points
- Functions created with the Function() constructor are always created in the global scope
- They do not create closures to their creation contexts
- All arguments except the last are treated as parameter names
- The function body is evaluated each time the function is called, making it slower than function declarations
- Useful for creating functions dynamically at runtime
Comparison with Other Function Creation Methods
| Method | Syntax | Scope Access | Performance |
|---|---|---|---|
| Function Declaration | function name() {} |
Local scope | Best |
| Function Expression | var fn = function() {} |
Local scope | Good |
| Function Constructor | new Function() |
Global scope only | Slower |
Conclusion
The Function() constructor creates functions dynamically from strings, useful for runtime function generation. However, it has performance implications and security considerations, so use it only when dynamic function creation is necessary.
Advertisements
