jQuery问题:这究竟是什么意思？

Question

(function($, window, undefined){
  ... jquery code... 
})(jQuery, window);

它到底意味着什么？这也意味着$(document).ready()什么？或者只是两件不同的事情？

Answer 1

已经有两个答案,但这是我对代码缺失结束的猜测:

(function ($, window, undefined) {
  // ... jquery code... 
})(jQuery, window);

注意:预计会有三个参数,但会提供两个参数.

它基本上是做什么的:

在花括号内部给出一个私有范围,因此任何var声明的内部都不可见
$在jQuery没有依赖全局设置的快捷方式的情况下创建一个私有快捷方式(例如,jQuery.noconflict()可能已被调用,这仍然有用)
创建一个词法窗口变量,这意味着更快地查找全局变量
确保undefined在花括号之间的范围内确实未定义,即使有人写了类似于undefined = "now it's defined";全局范围的内容,因为undefined实际上可以重新定义(这是语言的错误).

此模式称为立即调用函数,或简称立即函数,或自调用匿名函数或其他一些名称.基本思路是:

(function (x, y) {
    // ...
})(1, 2);

要么:

(function (x, y) {
    // ...
}(1, 2));

意思是:

function myFunction (x, y) {
    // ...
}
myFunction(1, 2);

但无需为您的函数指定任何名称并污染命名空间.

回到你的问题,这并不意味着$(document).ready()或类似的东西,但它意味着你可以使用$(document).ready() 内部而不是jQuery(document).ready()即使$外面没有快捷方式.

这个例子实际上可以更好地解释它,即使它没有在任何地方使用:

(function (JQ, window, undefined) {

    JQ(document).ready(function () {
        // this is run when document is ready
    });

})(jQuery, window);

现在代替$你可以调用jQuery 而不是JQ使用- 它可能看起来不是很有用,但它显示了当你有这样的代码时会发生什么.JQ(document).ready()$(document).ready()

作为旁注,我可以补充说,由于这种模式,你实际上并不需要语言中的变量声明,而只需要函数参数.代替:

var x = 10;
alert(x * x * x);

你可以使用:

(function (x) {
    alert(x * x * x);
})(10);

确实像这样的函数:

function square (x) {
    // some code ...
    var result = x * x;
    return result;
}

完全等同于:

function square (x, result) {
    // some code ...
    result = x * x;
    return result;
}

因为JavaScript中的提升机制result甚至在两种情况下(在// some code ...部分中)声明和赋值之前都会使变量可用(但未定义).这通常是混乱的根源,但实际上非常有趣且非常强大.

另请参阅我最近更新的其他问题答案:帮助理解JavaScript全局减排技术,以获取有关此主题的更多信息.