如何在 JavaScript 中通过字符串的形式执行函数

在本文中，我们将看到如何通过字符串的形式执行 JavaScript 函数。

例如：

function myFunction() {
    ...
}
const functionName ="myFunction";

在上面的代码中， functionName 是一个字符串，其值为 “myFunction” 。现在我们需要通过字符串 functionName 来运行函数 myFunction 。因此，在本文中我们将看到如何解决这个问题。

当您拥有函数名称的字符串时，有几种方法可以执行 JavaScript 函数。

方法 1：使用 eval() 方法：

eval() 方法是 JavaScript 中一个功能强大但通常不被鼓励使用的特性，它允许您执行任意代码作为字符串。您可以使用 eval() 方法来执行在您拥有其名称的字符串时的 JavaScript 函数。

语法：

function myFunction() {
      ...
}
const functionName = "myFunction";
eval(functionName + "()");

示例：

function greet(name) {
      console.log(`Hello,  ${name}!`); } const functionName = "greet"; // 使用 eval() 方法来执行函数 eval(`$ {functionName}("Alice")`);

输出：

Hello, Alice!

方法 2：使用 window[]：

在浏览器环境中，当您拥有函数名称的字符串时，您可以使用 window[] 语法来执行 JavaScript 函数。

语法：

function myFunction() {
    ...
}
const functionName = "myFunction";
window[functionName]();

示例：

function greet(name) {
  console.log(`Hello, ${name}!`);
}
const functionName = "greet";
  
// 使用 window[] 来执行函数
window[functionName]("Alice");

输出：

Hello, Alice!

方法 3：使用 Function 构造函数：

您可以使用 Function 构造函数创建一个新的函数对象，将函数名称作为字符串传递，并调用该新的函数对象。

语法：

function myFunction() {
    ...
}
const functionName = "myFunction";
const fn = new Function(`return ${functionName}()`);
fn();

示例： 在这个示例中，我们定义了三个变量：functionName的值为“greet”，这是函数的名称；functionArguments的值为“name”，这是函数的参数名称；functionBody的值为“console.log（’Hello，’ + name + ‘！’);”，这是函数的主体部分。然后我们使用Function构造函数动态地创建一个具有给定参数和主体的新函数，并将其存储在dynamicFunction变量中。

const functionName = "greet";
const functionArguments = "name";
const functionBody = 
    `console.log('Hello, ' + name + '!');`;
  
// 使用Function构造函数创建和执行函数
const dynamicFunction = 
    new Function(functionArguments, functionBody);
dynamicFunction("John");

输出结果：