如何使javascript字符串成为函数调用[重复]

Posted 2023-05-09

【中文标题】如何使javascript字符串成为函数调用[重复]

【英文标题】：how to make javascript string a function call [duplicate]

【发布时间】：2017-06-29 22:03:45

【问题描述】：

我有字符串logo.cr.Button 和函数

logo.cr.Button = function()
 //something


var strg = 'logo.cr.Button';
strg();

现在我必须以某种方式将该字符串设为函数调用

喜欢strg();，但它在说

strg 不是构造函数

这里

【问题讨论】：

稍微编辑了我的问题，请再次检查

不工作@thomas 说不是函数

听起来像XY Problem。为什么你首先需要这样做？提供有关您尝试解决的更高级别问题的更多详细信息

@Waqar：我忘记了名称间距问题，我的错。

是的，有人推荐@thomas ty

【参考方案1】：

通常，当我们编写 javascript 函数时，生成的函数声明如下所示：

function demo() 
  // function stuff here

您可能非常清楚“在 JavaScript 中，函数是一流的对象”。这是一个无处不在的短语，并且有充分的理由。这是一个非常强大的想法，它致力于将 JavaScript 提升到现在的位置。我们不会在这里详细介绍一流对象的细节。我们所关心的是，在 JavaScript 中，函数就是对象。 这意味着上面的函数也可以通过调用它的构造函数来声明：

var demo = new Function();

现在假设我们有一个带有参数和指令的函数：

function demo(name, age) 
  console.log('my name is ' + name);
  console.log('my age is ' + age);

现在将其转换为构造函数语法：

var demo = new Function(
  "name,age",
  "console.log('my name is ' + name);" + 
  "console.log('my age is ' + age);"
);

这很容易看出这两个函数是相同的，只是声明不同。重要的区别在于，我们应该能够轻松访问字符串。

这以非常相似的方式适用于您的函数。

var strfunc = new Function ("", "logo.cr.Button()");

我似乎无法格式化，因为我在移动设备上。但我会尽快的。

【讨论】：

感谢您的帮助

您不应该以这种方式使用eval 或new Function。一般来说，如果new Function 将访问此函数范围之外的变量，这是一个坏主意，因为如果您使用例如需要使用 transpilar 或缩小脚本。

@t-niese 我知道 eval 没有被使用，但是我已经使用了一个新的函数，它与一个转译器和一个 min 脚本一起使用，没有任何问题。如果您担心范围，您可以简单地将适当的上下文绑定到函数中或将其作为参数传递。我真的不认为“你不应该”的说法有任何根据。如果你能更详细地指出你为什么这么认为，我会很高兴？

eval 和 new Function 有同样的问题。两者都在运行时将字符串转换为代码。至此，每个转译器、缩小或 linting 脚本在处​​理代码时通常会忽略这些字符串。如果logo. 被转译器或缩小脚本重命名，则作为字符串给出的代码将不会更改并且会失败。因此，如果您使用eval 或new Function，那么您应该始终确保您不会访问在评估代码之外定义的变量。除非它保证即使在缩小或转换之后仍然存在。

我可以看到问题。我想也许我只是在我的编码方面更宽容一点。我不会争辩说 new Function 不应该被使用得比非常非常少，但就从字符串生成函数而言，如果你必须这样做，我发现它是最合适和最明智的解决方案。我会说老实说，我对 babel/js lint/min 设置没有任何问题，但也许我很幸运。话虽如此，我仍然不同意“你不应该”。如果你找不到比这更有效的方法，而且我认为在某些情况下它是合适的。

【参考方案2】：

使用 eval("logo.cr.Button")();

这将执行函数，当然如果你有这样的对象：

var logo = 
    cr: 

    
;

【参考方案3】：

这不起作用，因为 JavaScript 认为您正在使用点表示法。当您编写 logo.cr.Button() 时，JavaScript 会在对象 cr 中查找函数 Button()，该函数位于对象 logo 中。

我建议把名字改成logoCrButton = function()...

【参考方案4】：

您可以使用eval，但不推荐。 安全问题只是原因之一，因为用户可能会利用eval 来执行不应该执行的不同代码。在this 问题中得到了充分的解释。

var logo=cr:;
logo.cr.Button = function()
  console.log("something");


var string = "logo.cr.Button()";
eval(string);

如果您可以避免 eval，则使用普通的函数调用、对象或数组来代替。相反，与动态评估某些参数相比，遍历数组要好得多且更稳定，如您所见here。

第二个例子没有使用eval，但是你可以使用字符串调用某个函数：

var obj=logo:cr:Button:function()console.log("something");;

var string = "logo.cr.Button";

function callFunctionByString(string,obj)
  var parts = string.split('.');
  parts.forEach(function(part)
    obj = obj[part];
  );
  obj();


callFunctionByString(string,obj);

希望这会有所帮助。

【讨论】：

如果它不是一个好习惯，我为什么要使用它

希望我的第二个例子也适合您的问题。