有人可以解釋這個Javascript代碼嗎？

Question

我試圖了解此代碼的工作方式。 我終於發現這是一個循環。 它不是一個“ while”或“ for”循環，但是仍然是一個循環，因為我認為自己調用了它（如果我錯了，請糾正我）。

我了解它的主要功能：加載jQuery時，將JQuery加載到我的'foo'函數時傳遞。 為此，它將在Window檢查jQuery，如果不存在，它將重置timer() 。 那就是循環。 我明白了。

讓我解釋一下我不了解的內容：

1. 調用： CheckDependency.Deferred.execute(foo);
   • 為什么使用“延遲”關鍵字？
   • execute讓我感到困惑：我希望如果我調用CheckDependency.Deferred.execute ，它將只會執行該方法。 為什么它明顯運行計時器功能。 為什么不能在timer（）之后簡單地包含該代碼，因為它一直在那兒循環然后返回jquery？
2. 說到回報。 為什么那里有一種方法？ CheckDependency.Deferred.execute(foo); 對我來說，就像CheckDependency.Deferred.RETURN.execute(foo);一樣瘋狂CheckDependency.Deferred.RETURN.execute(foo); （或一些類似的瘋狂聲明）

我對JavaScript（來自PHP）很陌生。 這里的代碼：

function foo(){ console.log('jQuery found!');
} 
var CheckDependency = CheckDependency || { };
CheckDependency.Deferred = function () 
{
    var functions = [];
    var timer = function() {
        if (window.jQuery) {/* && window.jQuery.ui*/
            while (functions.length) {
                functions.shift()(window.jQuery);
            }
        } else {
            window.setTimeout(timer, 250);
        }
    };
    timer();
    return {
    execute: function(onJQueryReady) 
    {
        if (window.jQuery) { // && window.jQuery.ui
            onJQueryReady(window.jQuery);
        } else {
            functions.push(onJQueryReady);
        }
    }
  };
}();
CheckDependency.Deferred.execute(foo);

Answer 1

首先，我說自己不是JavaScript專家，但我還是涉獵:)我將描述一下這里發生的事情。

首先，這將創建一個名為“ CheckDependency”的新對象。

var CheckDependency = CheckDependency || { };

接下來，它運行一個匿名函數，並將結果存儲在CheckDependency.Deferred中。

CheckDependency.Deferred = function () 
{
    .
    .
    .
    .
}()

匿名函數運行以下代碼：

var functions = [];
var timer = function() {
    if (window.jQuery) {/* && window.jQuery.ui*/
        while (functions.length) {
            functions.shift()(window.jQuery);
        }
    } else {
        window.setTimeout(timer, 250);
    }
};
timer();

函數代碼的最后一部分返回一個新的函數execute ，該函數賦予CheckDependency.Deferred一個函數execute 。

return {
    execute: function(onJQueryReady) 
    {
       if (window.jQuery) { // && window.jQuery.ui
            onJQueryReady(window.jQuery);
        } else {
            functions.push(onJQueryReady);
        }
    }
  };

最后，這個新功能稱為

CheckDependency.Deferred.execute(foo);

最終結果是代碼啟動了一個后台計時器，該計時器將自行調用直到window.jQuery為true為止-這意味着jQuery已加載。 然后，傳遞給execute的函數將傳遞到此循環，因此一旦jQuery可用，傳遞給“ execute”的原始函數將使用window.jQuery實例進行window.jQuery 。

我希望我做到了這一正義，也希望我的回答會有所幫助！ 如果您有任何疑問，請告訴我。