为什么把我的JavaScript库包装在一个匿名函数中来修复我的竞争条件?

Why did wrapping my JavaScript library in an anonymous function fix my race condition?

本文关键字:我的 函数 条件 竞争 包装 JavaScript 为什么 一个      更新时间:2023-09-26

问题:为什么包装我的JavaScript库在一个匿名函数修复我的竞争条件?

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

我正在做一个项目,涉及使用crossrider编写浏览器扩展。如果你不熟悉在JavaScript中实现的跨骑扩展,你有一个可以与应用程序页面通信的背景页面。应用程序页面可以在每个打开的选项卡上运行,并且可以操作DOM。我计划在用户请求打开时远程加载大部分扩展代码。最近,当我在引用Raphael的页面上添加一个脚本标签时,我遇到了一个竞争条件,然后我用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]));
    })()
}

关于你的问题,我不认为<script />标签加载和评估的顺序有任何特定的标准;引入竞争条件很容易。

关于(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'
    });
});