Javascript ES6 在全局范围内引用变量，但不在窗口范围内

Question

我正在将我的代码从 ES5 升级到 ES6。在 ES5 中，我通过创建一个新脚本来动态加载函数，然后异步加载文件。代码如下：

loadClass : function(className) {
    if(typeof window[className] !== "function") {
        page.getCode(className, dirName);
        return;
    } ...


getCode(className) {
    var fileName = className.toLowerCase();
    var newScript = document.createElement('script');
    newScript.setAttribute("type", "text/javascript");
    newScript.setAttribute("src", '/public/js/' + fileName + '.js');
    var parmArr = [className];
    newScript.addEventListener('load', this.loadClass.bind("", parmArr));
    document.getElementsByTagName("head")[0].appendChild(newScript);
    return;
}

在 ES5 中，函数在全局范围内加载，在本例中为窗口。我有一个字符串中的函数/类名，我可以使用 window[classname] 引用该类，如上面的代码所示。在 ES6 中，我将调用函数和被调用函数更改为一个类。现在，当它加载脚本时，它在全局范围内作为 Myclass function() 存在，但不在窗口范围内，如 Chrome 调试器中所示：

Myclass ()
[[Scopes]] : Scopes[2]
    0 : Script
        Myclass () : () 

我不能再用一个变量作为 window[classname] 来引用它。抓住稻草我还尝试了 [classname]、global[classname] 和 Global[classname] 以及 this[classname] 和 script[classname] 但这不起作用。

在 ES6 中，当类名在变量中时，如何测试它是否已经加载？这可能是一件很容易的事情，但它让我无法理解。

提前致谢

Answer 1

这就是 ES6 的工作原理...为了避免污染全局对象（此处为 window），您的 JavaScript 代码不再创建全局属性（除非您是明确的）。在 ES5 中，这些属性是在全局范围内使用 var 或 function 时自动创建的。使用let、const 或class，什么都不会发生。考虑这个例子：

// ES5

var foo;

function qux() {}

console.log('foo' in window); // true
console.log('qux' in window); // true

// ES6

let bar;
const baz = '';

class Quux {}

console.log('bar' in window); // false
console.log('baz' in window); // false
console.log('Quux' in window); // false

window.bar = bar;
window.baz = baz;
window.Quux = Quux;

console.log('bar' in window); // true
console.log('baz' in window); // true
console.log('Quux' in window); // true