0

除了 jQuery 的 AJAX 函数之外，我对“异步” JavaScript 的理解非常有限。

我创建了一个系统，我将外部 Javascript 文件作为“模块”加载，以保持整洁和轻量级。可以在此处找到执行此操作的主要灵感 + 实现。

因此，例如，一个名为的 JS 文件foo.js可能包含以下具有设置属性的 JS 对象：

var bar = { 
   a:1,
   b:2
}

加载此外部文件后，可通过window.bar其后访问。因此，在浏览器的 Developer Tool JS 控制台中输入window.bar.a（或者bar.a）应该返回：

1

当我尝试将bar对象分配给变量时出现我的问题，这通常会在加载外部 JS 模块之前同步解决，并且通常包含undefined- 嘘！

到目前为止，这是我的尝试：如果对象实例已经存在，则基本上返回它window，否则等待它被加载然后返回它（理想情况下）：

var val = getInstance('bar');

这调用了我的函数：

function getInstance(name) {
    if(typeof window[name] === 'object'){
        return window[name];
    } else { 
        $(window).on('load', window[name], function() { 
            return window[name];
        });
    }
}

当然，undefined当我返回时console.log(val)。

我在这里知道一个事实，即我期望对象bar异步通过val. 然后我可以继续并开始通过（即）引用bar实例。valval.a == 1

我已经努力浏览 jQuery 的 Deferred Object ( $.Deferred) - 我的理解消失了，但我的截止日期很紧，如果我是对的，我想现在而不是几天后知道跟踪barinto的获取和实例val。

非常感谢任何帮助、指点或评论！

4

3 回答 3

1

我认为 Kevin B 已经给了你正确的答案。

考虑到您的时间线和对该主题的不熟悉，我建议您连接并缩小您的 JavaScript 文件，而不是使用异步模块。

否则，您将需要花时间了解如何使用 require 或 yepnope 等模块加载器。您引用的文章没有解决同时加载多个模块的问题，这可能是您的要求。您采用的任何异步脚本加载路径都将要求您利用回调来组织代码执行的顺序。

于 2013-06-27T17:21:56.490 回答
0 
var ajaxRequests = [];
var scriptUrlCollection = ['script1.js', 'script2.js', 'script3.js'];
$(scriptUrlCollection).each(function( index, url ) {
    ajaxRequests.push($.getScript(url));
});
$.when.apply($, ajaxRequests).done(function() { / *execute your code */);

您可以使用 ajax 加载您的脚本，然后在所有脚本完成后执行您的代码，这要归功于延迟对象。

每个 ajax 请求都返回一个 jQuery 延迟对象，我们将其添加到ajaxRequests数组中。当所有这些延迟对象都被解析时，该done()方法被执行。

于 2013-06-27T15:01:32.063 回答
0

如果我在正确的轨道上，我想现在而不是几天后知道

是的。Promise（如 jQuery 的 Deferred 实现）是必经之路。

在获取 bar 的实例并将其变为 val

不完全是。JS 中的 Promise 不是透明的，它们更像是代理对象。你仍然需要一个回调：

getInstance("bar").then(function(val) {
    // this function is executed asynchronously
    // and the `bar` instance is available here
});
于 2013-06-27T17:29:04.163 回答