jQuery $(function(){})vs(function(){})($)

我理解以下是简写$( document ).ready():

$(function() {
    console.log( "ready!" );
});

我也理解匿名JS函数是什么,但jQuery在使用一个函数调用时会做什么特别的事情.即:

(function() {
    console.log( "ready!" );
})($);

后者只是一个使用jQuery的普通匿名JS函数(即它不会被视为速记$(document).ready(),因此会立即执行)？

我觉得以前必须要问过,但如果有的话,我找不到它.

正如你所提到的,前者确实是一种速记$(document).ready().至于后者,这只是一个立即调用的函数表达式.

(function ($) {
    console.log('ready');
})(jQuery);

这个函数只是一个匿名函数,它接收一个名为的参数$.使用某个值(在本例中)作为参数立即调用该函数jQuery.

IIFE还可用于隔离范围并避免包含多个JavaScript文件的Web应用程序中的全局变量.在这种情况下,可以使用无参数IIFE:

(function () {
    // x is only accessible within this IIFE
    var x;
    // do something...
})();

有关立即调用函数表达式的更多信息,请参阅此问题:javascript中自执行函数的用途是什么？

第一个是,的确,对于一个简写$( document ).ready(),如指向这里.

但第二个是立即调用函数表达式(IIFE),一个声明并立即调用的匿名函数.

实际上,正确的语法(在您的示例中缺少参数)是:

(function($) {
    //my $ object is local now
})(jQuery);

在这种情况下,您将使用参数调用匿名函数.

这种模式(IIFE)的主要优点是:隔离你的代码(你可以创建任意数量的变量,它将被限制在你的匿名函数范围内,除非你返回一些东西).这种模式用于定义"私有"和"公共"方法.像这样:

var myModule = (function() {

    function privateFunction() { console.log("I can't be accessed from outside :("; }

    var privateVar = "me too :(";

    function publicFunction() { console.log("Hey! I'm here!"; }

    /* expose what you want */
    return {
        publicFunction: publicFunction
    }

})();

myModule.publicFunction(); //Hey! I'm here!
myModule.privateFunction(); //undefined;

你也可以称之为模块模式.

在第二个示例中,您使用参数调用最近创建的匿名函数,并且您的匿名函数接收该参数.这是一种依赖性注射方式.

这样,您可以将函数内的全局变量作为本地操作.请注意,在第一个示例中,我们传递一个jQuery对象并在函数内部对其进行操作$.有人覆盖jQuery对象更加困难,但是,某些脚本可以重新分配全局美元符号,特别是如果您没有完全控制您的应用程序.这样,你总是传递te jQuery对象并将其操纵为$.

最后,让我列出一些将参数传递给从这里抓取的IIFE的其他优点:

它更快:JavaScript首先查找本地范围(在攀爬之前).它可能会提高性能.

帮助缩小:minifier现在可以将范围内的变量重命名为单个字母,从而减少代码大小.