TypeScript - The Function () Constructor

---

---

The Function() Constructor

TypeScript supports the built-in JavaScript constructor called Function() to defined a function. The Function() constructor dynamically creates a function object at runtime.

You can define your function dynamically using Function() constructor along with the new operator.

The Function() constructor can accept multiple arguments. All the arguments except the last one are names of parameters and the last argument is the function body of new function to be created.

Syntax

Following is the syntax to define a function using Function constructor along with new operator −

let res = new Function(arg1, arg2, ..., functionBody);
let res = Function(arg1, arg2, ..., functionBody);

Function() can be called with or without new. Both syntaxes will create a new Function instance.

All the arguments, i.e., arg1, arg2, ..., functionBody, are strings.

Arguments

• arg1, arg2, ..., - These are optional arguments treated as the names of the parameters in the function to be created.

• functionBody − This argument contains the statements in function definition of the new function to be created.

All the arguments except the last one are optional. The last argument is required. If you are passing only a single argument, then it will be treated as function body.

Notice that the Function() constructor is not passed any argument that specifies a name for the function it creates. The unnamed functions created with the Function() constructor are called anonymous functions.

The new Function() is a call to the constructor which in turn creates and returns a function reference.

Examples

Let's understand the Function constructor with help of some example programs in TypeScript.

Example 1: Creating a simple function without parameters

In the example below, the Function() constructor takes only single argument. This argument is treated as the function body.

const greet = new Function("return 'Welcome to Tutorials Point!'");
console.log(greet());

On compiling TypeScript generate the same code in JavaScript.

The output of the above example code is as follows −

Welcome to Tutorials Point!

Example 2: Creating a simple function with parameters

In the example below, we call the Function() constructor passing three arguments, "x", "y" and "return x + y". The first two arguments are the names of the parameters of the new function instance, i.e., resFunction.

const resFucntion = new Function("x", "y", "return x + y");
let sum = resFucntion(5, 10);
console.log(sum);

On compiling, TypeScript will generate the same code in JavaScript.

The compiled JavaScript code will produce the following output −

15

Example 3: Creating a function instance from a function expression

In the example below, we define a function sum with function expression and pass it to the Function() constructor as a part of the parameter (function body).

Here the function expression requires a return statement with the function's name.

const add = new Function(
    "const sum = function (a, b) {return a+ b}; return sum",
)(); 
console.log(add(2,3));

TypeScript compiler will generate the same code in JavaScript.

The JavaScript code will produce the following output −

5

Example 4: Creating a function instance from a function declaration

In the example below, we pass a function declaration as an argument to the Function constructor. The function declaration doesn’t need a return statement with the function' name.

const sayHello = new Function(
    "return function (name) { return `Hello, ${name}` }",
)(); 
console.log(sayHello("Shahid"));

On compiling, it will generate the same code in JavaScript.

The output of the above example code is as follows −

Hello Shahid

The Function constructor in TypeScript can be used to define a function at execution time, but you should use it with caution as it can lead to vulnerabilities in the code.