Question

我正在尝试通过自定义加载程序加载一些JavaScript文件。以前我使用document.write()来编写我的所有文件，但我想使用jQuery。我绝对不是jQuery的专家，只使用了一些更基本的特性和功能，所以我上网了。好吧，我发现了以下一段代码，它可以正常工作，但我对理解它有点麻烦。这是代码：

(function() {
    // Poll for jQuery to come into existence
    var checkReady = function(callback) {
        if (window.jQuery) {
            callback(jQuery);
        }
        else {
            window.setTimeout(function() { checkReady(callback); }, 100);
        }
    };

    // Start polling...
    checkReady(function($) {
        // Use $ here...
    });
})();

我理解代码正在检查jQuery是否可用的事实，如果没有，它将继续检查每一秒。我也理解如果它可用，“轮询”下的代码将执行。我不理解的是什么，以及我很难缠绕我的大脑，是整个callback参数和checkReady变量。 checkReady既是变量又是函数？如果它是一个变量，它是顶部的一个函数，它怎么能在下面的代码中有一个与它相关的不同函数？另外，回调参数究竟在做什么？

Answer 1

在Javascript中，函数是第一类，这意味着它们可以被分配给变量，作为参数传递并像处理任何其他变量一样对待，例如5或{{ 1}}。

您在此处看到的内容"foo"是分配给变量var checkReady = function(callback) { ... }的函数。

您在此处看到的内容checkReady是使用 anonymous function checkReady(function($) { ... });作为参数的。在函数function($) { ... }内部，使用checkReady参数引用它。匿名函数只是意味着你有一个没有名字的文字函数，就像有一个字符串文字callback你可以调用"foo"而不命名它alert("foo");你可以用函数做同样的事情。它们可以被命名或内联为没有名字的文字内容。

您在此处看到的var str="foo"; alert(str);是使用匿名函数window.setTimeout(function() { checkReady(callback); }, 100);调用window.setTimeout，设置为在100毫秒内执行。在100毫秒内，它执行该函数，该函数包含一个递归回调function() { ... }的回调，它首先获得了相同的checkReady参数。

那么callback在做什么？它旨在包含您确定加载JQuery后要执行的所有操作。基本上它是你的程序的实质。 你将整个程序传递给任何其他变量到另一个经常检查事物的函数，并在它准备就绪时调用它。这是first-class functions的美丽。

Answer 2

也许这张漂亮的照片会有所帮助

 +-----------                      +------------+
 |          |                      |            |
 |       ...v.................     V            |
 |  +- - checkReady = function(callback) - -+   |
 |  :                              |        :   |
 |  :   callback() <-execute this--+        :   |
 |  :                anon func              :   |
 |  :                                       :   |
 |  +- - - - - - - - - - - - - - - - - - - -+   |
 |  :                                       :   |
 |  :                  +----------------------->+
 |  :                  |                    :   |
 |  :                  ^                    :   |
 +<---- checkReady(callback);               :   |
 |  :   call itself, sending the same       :   |
 |  :   anonymous callback function         :   |
 |  :                                       :   |
 |  +- - - - - - - - - - - - - - - - - - - -+   |
 |                                              |
 +-calls+                                       |
        |                                       |
        ^                                       |
    checkReady(function($) {                    |
        // this anon func goes here  >----------+
    });

Answer 3

代码

var name = function (params...) { ... statements ... };

创建一个未命名的（匿名）函数，并将对它的引用放入“name”变量中。重要的是，此代码不会创建“名称”功能。 “name”仅存储对该函数的引用。可以将此引用复制到另一个变量，然后可以通过另一个变量调用该函数，如下所示：

var newName = name;
newName(); // invokes the function

如果您想了解有关JavaScript函数的更多信息，我认为您可能会觉得这很有趣：

https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Functions

通过函数赋值和回调来理解这个jQuery代码

3 个答案: