13

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

我看过这篇文章并对此有所了解。但是还有更多的疑问,主要是关于它是如何使用的。


就像一个静态块!

因为它就像一个静态块自我调用!),它可以用于初始化(就像一些假想的常量)?

但是没有getter可用于从中获取任何东西并在其他地方使用它!


返回,必须?

上面的解决方案是return在那个函数中有一个?这样我就可以获取它返回的任何内容并使用它。


引用全局对象?!

(function(window, undefined){})(this);

上述代码的解释在引用帖子的第二个答案中,我无法理解,如果有人可以解释更多(或更简单),那就太好了


更新:看看这段代码↓

var myElement=document.getElemetById("myElementId");
 (function(myElement){
      /**'this' here is 'myelement'???**/
 }; 
})(this);
4

3 回答 3

15

一个常见的方法如下(称为命名空间) - 它通过立即执行您的函数并将您需要的基本部分返回到您的变量中来创建一个封装的范围:

var yourNamespace = (function(window, undefined){ 
                    /* private code:*/
                    var privateVar = "foobar",
                        count = 0;
                    /* the stuff you want to use outside: */
                    return{
                       val: 5,
                       publicVar:privateVar,
                       func:function(){return ++count}
                    }
             })(this);// `this` is a reference to `window` here

这样你就可以通过你的yourNamespace变量访问你需要的一切,同时仍然保持隐私并且不会污染全局对象。它被称为命名空间并使用闭包范式。您还可以移交函数以使用私有(对于封闭范围不可见)变量。

移交 undefined 的一个原因是,在 ES3 中 undefined 是可写的,而在 ES5 中不再是这种情况。作为参数移交通过在范围内创建对全局对象this的直接引用来缩短查找时间。window但是,要非常小心——在 ES5 严格模式下this不再是窗口,而是解析为undefined!! 所以不推荐这个了!

移交 window 和 undefined 的另一个原因是,现在这些是变量名,压缩器可以将它们压缩为单个字母。

if(myVar == undefined)
// could be compressed to:
if(a==x)

编辑您的问题:

在您的this示例中不会改变,您需要以下解决方案之一:

(function(myElement){/*your code*/})( document.getElemetById("myElementId") );
// or:
(function(){
    var myElement = document.getElemetById("myElementId");
    /* your code */ 
})();
于 2013-08-13T08:25:31.917 回答
2

iife的主要目的是创建一个封装的范围。否则,您声明的所有变量都将在全局范围内结束。
如果您需要从该范围内访问某些内容,您可以显式创建一个全局命名空间变量,即window.myApp = {}并将其附加到那里,即window.myApp.myMethod = function(){...}
传递window到 iife 的原因是它在该范围内创建了一个本地引用。这将缩短查找链以获得更好的性能,并且变量也可以最小化。


回答您更新的问题:

要使用此模式为元素创建本地引用,您可以将其作为参数提供给 iife:

(function(element){

    element.style.top = "100px";

})(document.getElementById("myId"));

...但我不确定以这种方式使用该模式有多大价值?根据我的评论,该this关键字不受影响,并且window在此示例中仍将指向该关键字。

我认为该this关键字使您感到困惑-它不一定与 iife 模式相关。以下是如何确定其价值的一个很好的解释:http: //net.tutsplus.com/tutorials/javascript-ajax/fully-understanding-the-this-keyword/

于 2013-08-13T08:29:25.000 回答
2

> 可以用来初始化吗?...没有可用于从中获取任何东西的吸气剂!

是的,它通常用于初始化,尽管它可能不需要获取任何东西。

> 上面的解决方案是有回报吗?

不,它不必有回报,但它可能会再次出现。如果有回报,它将过去……即

var a = (function(){})();

a将有任何返回或未定义。

(function(window, undefined){})(this);

参数this将是调用者 - 通常它是 window ,但可能是任何对象。如果您将此作为参数传递,它将可以通过第一个参数(在这种情况下为 window )访问。

希望解释足够清楚。

于 2013-08-13T08:29:54.683 回答