2013-06-27 67 views
0

除了jQuery的AJAX功能外,我對JavaScript的理解「異步」非常有限。通過JavaScript異步返回對象「實例」

我已經創建了一個系統,我在「模塊」中加載外部Javascript文件,以保持整潔和輕量級。主要靈感+執行此操作可以找到here

因此,舉例來說,一個JS文件名爲foo.js可能包含以下JS對象與設置屬性:

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

後這個外部文件已經加載它通過window.bar此後的訪問。所以,鍵入在window.bar.a(或者bar.a)到瀏覽器的開發者工具JS控制檯應該返回:

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。然後,我可以繼續並通過val(即val.a == 1)開始參考bar實例。

我已經努力瀏覽了jQuery的延遲對象($.Deferred) - 我的理解消失了,但我處於緊迫的最後期限,並希望現在知道而不是幾天後,如果我在正確的軌道上獲取bar的實例並將其轉化爲val

任何幫助,指針或意見,非常感謝!

+1

*「否則等待它被加載,然後返回它(理想情況下):」*不能異步工作。我建議使用解決此問題的現有框架(如requirejs)或構建類似的東西。 –

+1

使用回調函數 –

+0

@KevinB因此我的問題是關於整個問題。獲取一個實例而不必依賴回調是我的主要目標 - 它只是佔位符代碼來*嘗試*並複製我想要實現的。 – zesda

回答

1

我認爲凱文B給了你正確的答案。

考慮到您的時間表和不熟悉的主題,我會建議連接和縮小您的JavaScript文件,而不是做異步模塊。

否則,您需要投入時間瞭解如何使用模塊加載器,如require或yepnope。您參考的文章沒有涉及同時加載多個模塊,這可能是您的需求。您採取異步腳本加載的任何路徑都需要您利用回調來組織您的代碼執行的順序。

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()方法。

0

現在,我想知道,而不是幾天下來行,如果我在正確的軌道

是上。 Promises(如jQuery的Deferred實現)是要走的路。

在獲取和酒吧的實例爲VAL

不完全是。 JS中的承諾並不透明,它們更像代理對象。你仍然需要一個回調:

getInstance("bar").then(function(val) { 
    // this function is executed asynchronously 
    // and the `bar` instance is available here 
});