Javascript：使用 "new Function()" 到运行字符串中的代码并使其访问 class 定义

Question

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

我有 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;
    }
  };
}();

然后我有 test.js 其中包含：

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

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

这是 index.html 中的全部运行，其中包含：

<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("ui.makeSomethingHappen();");

甚至

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

我收到一条异常消息

MainUI is not defined

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

所以我希望有人能告诉我如何让函数内部的代码访问外部的 class 定义。

Answer 1

确保 MainUI.js script 被正确引用，并且在将使用它的 test.js script 之前被引用。

Javascript：使用 "new Function()" 到运行字符串中的代码并使其访问 class 定义

Javascript: Use "new Function()" to run code in a string and have it access class definitions

javascript

scope

eval

class

function

Javascript：使用 "new Function()" 到 运行 字符串中的代码并使其访问 class 定义

Javascript: Use "new Function()" to run code in a string and have it access class definitions

javascript

scope

eval

class

function

Javascript：使用 "new Function()" 到运行字符串中的代码并使其访问 class 定义