Javascript:Use"；新函数（）；以字符串形式运行代码并使其访问类定义_Javascript_Function_Class_Scope_Eval

Javascript:Use"；新函数（）；以字符串形式运行代码并使其访问类定义

javascript function class

Javascript:Use"；新函数（）；以字符串形式运行代码并使其访问类定义,javascript,function,class,scope,eval,Javascript,Function,Class,Scope,Eval,我的实际代码很密集，所以我试图将其简化为一个最小的示例我有MainUI.js，它包含： var MainUI = function(){ 'use strict'; var singleton = null; class MainUI { makeSomethingHappen(){ console.log("MAGIC!"); } } return { getSingleton: function(){

我的实际代码很密集，所以我试图将其简化为一个最小的示例

我有MainUI.js，它包含：

var MainUI = function(){
  'use strict';
  
  var singleton = null;

  class MainUI {
    makeSomethingHappen(){
      console.log("MAGIC!");
    }
  }

  return {
    getSingleton: function(){
      if (singleton == null) singleton = new MainUI();

      return singleton;
    }
  };
}();

function test(code){
  var uis = MainUI.getSingleton();

  retValue = new Function("ui", "use strict'" + code)(uis);
}

<html>
  <script type="text/javascript" src="MainUI.js"></script>
  <script type="text/javascript" src="test.js"></script>

  <body onload="test('ui.makeSomethingHappen();');">
  </body>
</html>

然后我有test.js，它包含：

var MainUI = function(){
  'use strict';
  
  var singleton = null;

  class MainUI {
    makeSomethingHappen(){
      console.log("MAGIC!");
    }
  }

  return {
    getSingleton: function(){
      if (singleton == null) singleton = new MainUI();

      return singleton;
    }
  };
}();

function test(code){
  var uis = MainUI.getSingleton();

  retValue = new Function("ui", "use strict'" + code)(uis);
}

<html>
  <script type="text/javascript" src="MainUI.js"></script>
  <script type="text/javascript" src="test.js"></script>

  <body onload="test('ui.makeSomethingHappen();');">
  </body>
</html>

这都是从index.html运行的，它包含：

var MainUI = function(){
  'use strict';
  
  var singleton = null;

  class MainUI {
    makeSomethingHappen(){
      console.log("MAGIC!");
    }
  }

  return {
    getSingleton: function(){
      if (singleton == null) singleton = new MainUI();

      return singleton;
    }
  };
}();

function test(code){
  var uis = MainUI.getSingleton();

  retValue = new Function("ui", "use strict'" + code)(uis);
}

<html>
  <script type="text/javascript" src="MainUI.js"></script>
  <script type="text/javascript" src="test.js"></script>

  <body onload="test('ui.makeSomethingHappen();');">
  </body>
</html>

甚至

test("console.log('NARF!');");

我收到了一条异常消息

MainUI is not defined

singleton访问器和MainUI在“new Function（）”之外的所有代码中工作，因此我知道它在工作（即使我在生成最小测试时出现了印刷错误）

因此，我希望有人能告诉我如何让函数内部的代码访问外部的类定义。

确保正确引用了

MainUI.js

script

，并且在使用它的

test.js

script

之前引用了它。

函数构造函数没有可以访问局部变量。它在全局范围内执行代码。为什么还要在这里使用函数构造函数呢？为什么不传递回调呢？我将变量作为参数传递给函数调用：“（uis）”。我也不明白变量访问如何解释类定义错误。你能解释一下回调如何解决我的问题吗？如果你把

（ui）=>ui.doSomething（）

作为回调传入，在

test

中调用

callback（mainUI）

你就不必费劲去构造有效的JS代码了——你也可以得到回调的完整工具支持，包括语法突出显示，linting、编辑器重构等等。这只是一个很小的例子。我不知道编译时的代码是什么，因为它将作为来自外部源的文本输入。这就是为什么我要传递有用的类实例以供代码使用。根据您显示的最小代码，问题不在于

new Function（）

而是在于

var-uis=MainUI.getSingleton（）因为这是引用MainUI
的地方，您的错误涉及MainUI。新函数
引用字符串“mainUI”