为什么将我的 JavaScript 库包装在匿名函数中可以修复我的竞争条件？

Question

问题：为什么将我的 JavaScript 库包装在匿名函数中可以修复我的竞争条件？

注意：我还对同步和异步加载外部 JavaScript 资源的良好解决方案的评论感兴趣。

我正在开发一个项目，涉及使用 crossrider 编写浏览器扩展。如果您不熟悉跨骑手扩展，它们是用 JavaScript 实现的，您有一个可以与应用程序页面通信的后台页面。应用程序页面可以与每个打开的选项卡一起运行，并且可以操作 DOM。我计划在用户请求打开时远程加载大部分扩展代码。最近，当我向页面 引用 Raphael 添加脚本标签时，我遇到了竞争情况，然后我构建了一些< a href="http://raphaeljs.com/graffle.html" rel="nofollow noreferrer">out of graffle

根据我的理解，如果页面加载了那些已经就位的脚本标签，然后执行将同步发生，尽管由于我附加了脚本标签，所以执行是异步发生的。这与大多数人似乎遇到的问题相反。经过一番研究，我了解到将我的代码 graffle 代码包装在匿名函数中可以修复我的竞争条件。为什么？我读过这篇关于将整个Javascript文件封装在匿名函数中的文章，这似乎与种族没有任何关系条件。

我的调用代码：

var scriptsToLoad   = [ "http://example/Scripts/lib/raphael.js",
                "http://example/Scripts/lib/graffle.js",
                "http://example/Scripts/lib/log4javascript.js"];

for(var i in scriptsToLoad) {
    (function(){
        $("head")
            .append($("<script></script>")
                .attr("type", "text/javascript")
                .attr("src", scriptsToLoad[i]));
    })()
}

Answer 1

关于您的问题，我不认为对于

关于（a）同步脚本加载，使用 jQuery，执行以下操作：

var scriptsToLoad = [
    "http://example/Scripts/lib/raphael.js",
    "http://example/Scripts/lib/graffle.js",
    "http://example/Scripts/lib/log4javascript.js"
];

$.each(scriptsToLoad, function (index, script) {
    $.ajax({
        url      : script,
        async    : false,
        dataType : 'script'
    });
});