javascript - 自调用函数作为 jQuery 文档就绪回调

Question

和有什么区别

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

和

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

Answer 1

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

在上述情况下，函数被传递给 jquery，一旦文档准备好，它将被执行。

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

在上述情况下，函数的返回被传递给 jquery。由于该函数是自行执行的，因此它将立即执行，并且无论函数返回什么都将传递给 jquery，因此这不是一个好方法，因为目标是在文档准备好后执行该函数，而这并没有发生案子

Answer 2

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

这个只有在 DOM 完全加载时才会执行，它的快捷方式是：

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

---

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

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

Answer 3

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

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

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

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

Answer 4

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

只是 jQuery 的简写：

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

相反，立即调用的函数表达式（或 IIFE）是“立即执行”的表达式，约定用括号括起来，但每种表达式都会立即执行，请参见以下 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");
}();

我希望它很清楚，再见。