如何根据函数名字符串执行 JavaScript 函数?


从存储在变量中的字符串调用函数可以通过两种不同的方式完成。第一种方法使用 window 对象方法,第二种方法使用eval() 函数。

本教程将指导您学习如何使用其名称作为字符串来执行 JavaScript 函数。

使用 window[]() 方法

在这里,要使用函数名作为字符串执行函数,应使用以下语法将字符串更改为指针。

语法

var functionName = "string";
functionName = window[functionName]( parameters );

这里我们将一个字符串存储为函数名,并使用 window[] 调用此值。

算法

  • 步骤 1 - 定义一个函数来显示输出

  • 步骤 2 - 定义另一个函数,并在全局变量中将输出函数的名称作为字符串赋值。如果需要,可以将参数传递给输出函数。

  • 步骤 3 - 现在在 window[] 内调用此全局变量,这将执行输出函数。

示例

在下面的示例中,showOutput 是定义用于显示输出的函数。winObjFunc 定义为对存储在全局变量 strFunc 中的 showOutput 函数名执行 window[] 操作。使用上述语法,调用 showOutput 函数,并执行该函数。

<html> <body> <h2>Using the <i>window object</i> method to execute function with its string name.</h2> <p id="namStrDisp"></p> <script> function showOutput(output) { document.getElementById('namStrDisp').innerHTML = output; } function winObjFunc() { strFunc = "showOutput"; outStr = 'Output by the window object'; window[strFunc](outStr); } winObjFunc(); </script> </body> </html>

使用 eval() 方法

要使用函数名作为字符串执行函数,可以使用 eval()。在这种情况下,函数的参数可以是语句、表达式、变量、现有对象的属性或表达式序列。请按照以下语法使用此方法。此方法唯一的缺点是其浏览器支持有限,并且被认为已过时。

语法

用户可以按照以下语法使用 eval() 方法调用函数。

eval( strFunction );

与 window 对象方法类似,将字符串函数名作为参数发送到 eval() 方法。

示例

在下面的示例中,evalOutput 是定义的输出函数。全局变量 evalStr 将此函数与参数作为字符串存储。使用上面解释的语法,eval() 调用变量中的此字符串值,我们得到输出函数正在运行。

<html> <body> <h2>Using the <i>eval()</i> method to execute function with its string name.</h2> <p id="evlStrDisp"></p> <script> function evalOutput(info) { document.getElementById('evlStrDisp').innerHTML = info; } function evalFunc() { evalStr = "evalOutput('eval method here')"; eval(evalStr); } evalFunc(); </script> </body> </html>

在本教程中,我们了解了当我们有函数名作为字符串时执行 JavaScript 函数的两种方法。

window 对象方法是最常用的方法。eval() 方法已弃用,不建议使用。

更新于: 2022-08-23

2K+ 次查看

开启你的 职业生涯

通过完成课程获得认证

开始学习
广告