TypeScript - Function() 构造函数



Function() 构造函数

TypeScript 支持 JavaScript 内置的 Function() 构造函数来定义函数。Function() 构造函数在运行时动态创建函数对象。

您可以使用 Function() 构造函数和 new 运算符动态定义函数。

Function() 构造函数可以接受多个参数。除了最后一个参数外,所有参数都是参数名称,最后一个参数是新创建函数的函数体。

语法

以下是使用 Function 构造函数和 new 运算符定义函数的语法:

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

Function() 可以使用或不使用 new 调用。两种语法都将创建一个新的 Function 实例。

所有参数,即 arg1、arg2……functionBody,都是字符串。

参数

  • arg1、arg2…… - 这些是可选参数,被视为要创建的函数的参数名称。

  • functionBody - 此参数包含要创建的新函数的函数定义中的语句。

除了最后一个参数外,所有参数都是可选的。最后一个参数是必需的。如果您只传递一个参数,则它将被视为函数体。

请注意,Function() 构造函数不会传递任何指定其创建的函数名称的参数。使用 Function() 构造函数创建的未命名函数称为匿名函数。

new Function() 是对构造函数的调用,它依次创建并返回函数引用。

示例

让我们通过一些 TypeScript 示例程序来了解 Function 构造函数。

示例 1:创建没有参数的简单函数

在下面的示例中,Function() 构造函数只接受单个参数。此参数被视为函数体。

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

编译 TypeScript 将在 JavaScript 中生成相同的代码。

上述示例代码的输出如下:

Welcome to Tutorials Point!

示例 2:创建具有参数的简单函数

在下面的示例中,我们调用 Function() 构造函数,传递三个参数:“x”、“y”和“return x + y”。前两个参数是新函数实例 resFunction 的参数名称。

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

编译后,TypeScript 将在 JavaScript 中生成相同的代码。

编译后的 JavaScript 代码将产生以下输出:

15

示例 3:从函数表达式创建函数实例

在下面的示例中,我们使用函数表达式定义一个函数 sum,并将其作为参数(函数体)的一部分传递给 Function() 构造函数。

此函数表达式需要一个包含函数名称的 return 语句。

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

TypeScript 编译器将在 JavaScript 中生成相同的代码。

JavaScript 代码将产生以下输出:

5

示例 4:从函数声明创建函数实例

在下面的示例中,我们将函数声明作为参数传递给 Function 构造函数。函数声明不需要包含函数名称的 return 语句。

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

编译后,它将在 JavaScript 中生成相同的代码。

上述示例代码的输出如下:

Hello Shahid

TypeScript 中的 Function 构造函数可用于在执行时定义函数,但应谨慎使用,因为它可能导致代码漏洞。

广告