JavaScript ES6动态加载类并检查是否已加载？

Question

我正在尝试动态加载一个类，并检查它是否之前已加载。下面的代码无法正常工作，为什么？

我无法理解为什么这部分不起作用：

if (typeof window['Car'] == 'undefined')

全文：

if (typeof window['Car'] == 'undefined') {
				alert("Car class not loaded!");
			}
      
var head = document.getElementsByTagName('head')[0];

var script = document.createElement('script');
script.src = 'http://m.uploadedit.com/bbtc/1572125047736.txt';
script.type = 'text/javascript';

head.append(script);
      
 setTimeout(function(){
           if (typeof window['Car'] == 'undefined') {
          alert("Even After X seconds, Car class not loaded!");
        }else{
          alert("After X seconds, Car class loaded!");
        } 

  }, 3000);
       

Answer 1

像您异步运行脚本一样动态地插入脚本，因此您要在运行动态加载的脚本之前检查已加载的类。

您可以使用script.onload找出脚本何时完成加载，然后检查该回调中是否存在您的类。

此外，class构造函数未添加到window对象，因此您必须更改测试其存在的方式，如下所示。

        var head = document.getElementsByTagName('head')[0];

        var script = document.createElement('script');
        script.src = 'http://m.uploadedit.com/bbtc/1572125047736.txt';
        script.type = 'text/javascript';
        script.onload = function() {
            if (typeof Car === "function") {
                alert("Car class loaded!");
            } else {
                 alert("Car class not loaded!");
            }
        }

        head.append(script);