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 + "()"); 

例子： 在这个例子中，我们定义了一个名为greet的函数，它会将一个问候语记录到控制台，并且定义了一个名为functionName的变量，它的值是“greet”，也就是这个函数的名字。然后，我们使用eval()方法来执行这个函数，它构建了一个调用这个函数的代码字符串，并传入参数“Alice”。这样就会执行greet函数，并将输出“Hello, Alice!”记录到控制台。

Javascript

function greet(name) { 
      console.log(`Hello, {name}!`); 
} 
  
const functionName = "greet"; 
  
// Using eval() to execute the function 
eval(`{functionName}("Alice")`);

输出：

Hello, Alice!

方法2：使用window[]： 在浏览器环境中，您可以使用window[]语法来执行一个JavaScript函数，当您只有其名称作为一个字符串时。

语法：

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

示例: 在此示例中，我们定义了一个名为greet的函数，该函数将问候语记录到控制台上，并定义了一个名为functionName的变量，其值为”greet”，这是函数的名称。然后，我们使用window[functionName]通过函数名作为字符串访问该函数，并使用参数”Alice”调用它。这将导致执行greet函数，并将输出”Hello, Alice!”记录到控制台。

Javascript

function greet(name) { 
  console.log(`Hello, ${name}!`); 
} 
const functionName = "greet"; 
  
// Using window[] to execute the function 
window[functionName]("Alice");

输出：

Hello, Alice!

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

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

语法：

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

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

JavaScript

const functionName = "greet"; 
const functionArguments = "name"; 
const functionBody =  
    `console.log('Hello, ' + name + '!');`; 
  
// Using the Function constructor  
// to create and execute the function 
const dynamicFunction =  
    new Function(functionArguments, functionBody); 
dynamicFunction("John");

输出：

Hello, John!