内联函数调用有什么好处？

I saw this code (explicly it's in jQuery, with modification)

我看到了这段代码(显然它是在jQuery中,有修改)

(function(window,undefined){
    var jQuery=(function(){
        var jQuery=something;
        jQuery.xxx=xxx;
        //...
        return jQuery;
    })();
    //...
    window.jQuery=window.$=jQuery;
})(window);

While I understand wrapping code in a inline function call can clearly define the variable scope, I don't understand the benefits of

虽然我理解在内联函数调用中包装代码可以清楚地定义变量范围,但我不明白它的好处

1. passing window with a parameter instead of using it directly,

使用参数传递窗口而不是直接使用它,

2. getting an instance of undefined by a undefined parameter, and also

通过未定义的参数获取未定义的实例,以及

3. defining jQuery by the return value of another inline function call. Can somebody explain a bit?

通过另一个内联函数调用的返回值定义jQuery。有人可以解释一下吗?

---

EDIT write #3 more clearly:

编辑更清楚地写#3:

What I understand is that the code defines jQuery inside another function then return it.

我的理解是代码在另一个函数中定义jQuery然后返回它。

//(function(window,undefined){
var jQuery=(function(){
    // Inside this function defines jQuery and return it?
    var jQuery=function(selector,context){
        return new jQuery(selector,context); //simplified
    };
    jQuery.xxx=xxx;
    //...
    return jQuery;
})(); // This executes the inline function and assign `jQuery` with the return value???
//... })(window);

This is more like the following:

这更像是以下内容:

function define_jQuery(){
    // Inside this function defines jQuery and return it?
    var jQuery=function(selector,context){
        return new jQuery(selector,context); //simplified
    };
    jQuery.xxx=xxx;
    //...
    return jQuery;
}

//(function(window,undefined){
var jQuery=define_jQuery(); // This executes the inline function and assign `jQuery` with the return value???
//... })(window);

Wouldn't it be more simpler to do:

这样做不会更简单:

//(function(window,undefined){
var jQuery=function(selector,context){
    return new jQuery(selector,context); //simplified
};
jQuery.xxx=xxx;
//...
//... })(window);

4 个解决方案

#1

Answering these questions each separately:

分别回答这些问题:

1. Why window passed in? Because dereferencing a variable in JavaScript is painful. Passing in an instance means you don't have to. Typically the mechanism looks like this:

   为什么窗口传入?因为在JavaScript中解除引用变量是很痛苦的。传递实例意味着您没有必要。通常,机制如下所示:

   (function (window, document, $) {
   }(window, window.document, jQuery));
   

   In this scenario, one need not go to the global scope to dereference any of these three (and jQuery can be in .noConflict() to boot).

   在这种情况下,不需要去全局范围来取消引用这三个中的任何一个(并且jQuery可以在.noConflict()中引导)。

2. This is valid JavaScript: undefined = 2;. I grant that is very foolish, but it is possible. But if one accepts one more argument in a function than is passed, one is confident it is truely undefined and not a hacked copy of it.

   这是有效的JavaScript:undefined = 2;。我认为这是非常愚蠢的,但这是可能的。但是如果一个函数接受的函数多于传递的一个参数,那么人们就会确信它是真正未定义的,而不是它的被黑客攻击的副本。

3. Returning jQuery from a previous function allows method chaining: $('#sel').func1().func2(). This is possible because func1 probably looks something like this:

   从前一个函数返回jQuery允许方法链接:$('#sel')。func1()。func2()。这是可能的,因为func1可能看起来像这样:

   jQuery.fn.func1 = function () {
       return $(this).each(function () {
           // do something fabulous
       };
   };
   

return $(this).bla_de_bla() is short-hand for:

return $(this).bla_de_bla()是简写:

    $(this).bla_de_bla(..);
    return $(this);

It also presumes that .bla_de_bla() also returns $(this)

它还假设.bla_de_bla()也返回$(this)

EDIT: modified #3 to note that it's best at chaining rather than circumnavigating around .noConflict() and mis-named $.

编辑:修改#3注意它最好链接而不是环绕.noConflict()和错误命名$。

#2

One reason is for code minification. Minifiers can't shrink global names since they would no longer refer to the global object. By passing in all objects you're working with, they become local. That way the thousands of references to window, and undefined can be minified.

一个原因是代码缩小。 Minifiers无法缩小全局名称,因为它们不再引用全局对象。通过传递您正在使用的所有对象,它们变为本地对象。这样,可以缩小对窗口和未定义的数千个引用。

#3

Passing window as a parameter does precisely bugger all and is a waste of space: it is an object and so is passed by reference. Any changes to window inside the closure will affect the same instance as outside.

将窗口作为参数传递确实可以完全消除所有错误并且浪费空间:它是一个对象,因此通过引用传递。对闭包内窗口的任何更改都会影响与外部相同的实例。

Getting an undefined parameter is a countermeasure to anyone stupid enough to name an actual variable undefined (which you can't do in newer browsers anyway)

获取一个未定义的参数是任何愚蠢到足以命名实际变量undefined的对策(无论如何你都无法在新的浏览器中做到)

As far as I can tell, that second inline function is completely pointless, except if temporary variables are used in the process of defining jQuery properties.

据我所知,第二个内联函数完全没有意义,除非在定义jQuery属性的过程中使用临时变量。

#4

The beautiful part about the "window" param is NOT Dereferencing. What if you pass in "window" in one instance and window.parent in another (think child windows controlling the parent for advance functionality, duh!!!).

关于“窗口”参数的美丽部分不是解除引用。如果你在一个实例中传入“window”而在另一个实例中传递window.parent(想想控制父级的子窗口以获得高级功能,那么该怎么办!!!)。

1. explained above.

2. I'm not quite sure yet.

   我还不太确定。

3. Chaining!!! ex: $('#blah').hide().show();

   链接!例如:$('#blah')。hide()。show();

if the hide function didn't return the object (#blah), show couldn't do anything with it! It's returning #blah to the show function.

如果隐藏功能没有返回对象(#blah),则show无法执行任何操作!它正在将#blah归还给show函数。

JQuery is always just a bit smarter than I am (and I usually find the hidden clues!).

JQuery总是比我更聪明(我经常找到隐藏的线索!)。