自调用函数作为 jQuery 文件就绪回调

Question

有什么区别

$(function() {
    // bind some event listeners
});

和

$(function() {
    // bind some event listeners
}());

Answer 1

$(function(){...}); OR $(document).ready(function(){ ... });

此函数在 DOM 准备就绪时调用，这意味着您可以开始查询元素等。 .ready() 将在不同的浏览器上使用不同的方式来确保 DOM 真的准备好了。

(function(){ ... })();

这只不过是一个在浏览器解释您的 JavaScript 时尽快调用自身的函数。因此，您不太可能在这里成功地对 DOM 个元素进行操作。

Answer 2

$(function() {
    // bind some event listeners
});

这个只有在DOM完全加载时才会执行，它是:

的快捷方式

$(document).ready(function(){
  // Write code here
});

$(function() {
    // bind some event listeners
}());

这个是一样的，但是$()里面的函数是一个自调用函数。通常目标是防止变量名冲突，因为它正在创建一个新的范围。

Answer 3

$(function() { ... });

只是 jQuery 的缩写：

$(document).ready(function() { ... });

立即调用的函数表达式（或 IIFE）是表达式 "immediately executed"，约定是用括号括起来，但是每一种表达式都是立即执行的，见下面的IIFE函数：

(function() {
    console.log("IIFE 1");
}());

+function() {
    console.log("IIFE 2");
}();

1-function() {
    console.log("IIFE 3");
}();

var f = 50 * function() {
    console.log("IIFE 4");
}();

我希望已经清楚了，再见。

Answer 4

$(function() {
    // bind some event listeners
});

在上面的例子中，函数被传递给 jquery，它将在文档准备好后执行。

$(function() {
    // bind some event listeners
}());

在上面的例子中，函数的 return 被传递给了 jquery。由于该函数是 se3lf 自行执行的，它会立即执行，并且无论函数 returns 将传递给 jquery，所以这不是一个好方法，因为 objective 是一旦文档准备好就执行函数，这在这种情况下不会发生

自调用函数作为 jQuery 文件就绪回调

Self Invoking Function as jQuery ducument ready callback

javascript

jquery

closures

addeventlistener

self-invoking-function